Div some após selecionar uma opção de seleção
O negócio é o seguinte: estou criando apenas um arquivo html bem simples e básico para os atendentes utilizarem para agilizar o serviço deles em vez de inserir manualmente. Então, estou com uma dificuldade para tentar achar o problema que está ocasionando o div sumir após selecionar a segunda opção para baixo (tenta selecionar Beltrano ou Carlitos) na seleção, apenas a primeira opção Fulano está funcionando (outro detalhe: no outro arquivo que tenho segue a mesma lógica, mas é arquivo teste apenas e funciona de escolher qualquer uma das opções normalmente, mesmo sendo um arquivo-teste). Veja o código abaixo e me diz onde tá o erro que está causando??
PS: estou utilizando o Chrome apenas, a pedido da empresa.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title>SCRIPTS - RECEPÇÃO</title>
<style type="text/css">
.carimboExecutador{
background: #ff0000;
}
.box{
color: #fff;
padding: 20px;
display: none;
margin-top: 20px;
}
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("select").change(function(){
$(this).find("option:selected").each(function(){
var optionValue = $(this).attr("value");
if(optionValue){
$(".box").not("." + optionValue).hide();
$("." + optionValue).show();
} else{
$(".box").hide();
}
});
}).change();
});
function copiarTexto5() {
var textoCopiado5 = document.getElementById("link5");
textoCopiado5.select();
document.execCommand("Copy");
}
<!-- function copiarTexto() { -->
<!-- var textoCopiado = document.getElementById("link"); -->
<!-- textoCopiado.select(); -->
<!-- document.execCommand("Copy"); -->
<!-- } -->
function selecionaAtendente(){
var puxa = $( "#listaAtendente" ).val();
var str = document.getElementById("link5").value;
var n = str.replace(/XX|FULANO|BELTRANO|CARLITOS/gi,puxa);
document.getElementById("link5").value=n;
}
</script>
</head>
<body><!-- DIV PARA EXIBIR LISTA DE OPÇÕES -->
<div>
<h4><font face="arial" color="red">ESCOLHA A SCRIPT:</font></h2>
<select>
<option disabled selected>Clique aqui para exibir a lista</option>
<option disabled></option>
<option value="carimboExecutador">Carimbo - Identificação Executador</option>
</select>
</div>
<!-- CLASSES PARA EXIBIR DIVS SELECIONADOS -->
<div class="carimboExecutador box">
<h2><font face="arial" color="white">CARIMBO - IDENTIFICAÇÃO EXECUTADOR</font></h2>
<b><font face="arial" color="white">Selecione o Responsável:</font></b> <select id="listaAtendente">
<option value="FULANO">Fulano</option>
<option value="BELTRANO">Beltrano</option>
<option value="CARLITOS">Carlitos</option>
</select>
<button onclick="selecionaAtendente()">Preencher Técnico</button>
<textarea rows="4" cols="90" id="link5" name="link5" readonly>
NOME: XX
CARGO: ATENDENTE DE TELEMARKETING
</textarea>
<br/><button onClick="copiarTexto5()">Copiar Texto</button>
</div>
</body>
</html>Discussão (0)
Carregando comentários...