1

Boa tarde, eu tenho um checkbox selecionado (check = true)

<div class="form-group col-xs-12 col-sm-12 col-md-3 col-lg-3 space">
<div class="input-group">
    <span class="input-group-addon">
        <input type="radio" id="cat5" name="rd_categoriaRamal" value="cat5" checked>
    </span>
    <label class="form-control" for="cat5">Cat. 5</label>
    <span class="input-group-addon"><span id="teste" class="fluigicon fluigicon-info-sign bs-docs-popover-hover" data-toggle="popover" title="" data-content="Ligações locais, celular e DDD." data-original-title="Popover title"><label class="form-control" for="cat5">Cat. 5</label></span></span>
</div>
</div>

e eu quero pegar o valor do data-content que está perto dele:

"data-content="Ligações locais, celular e DDD."

eu tentei com esse codigo aqui, porem sem sucesso:

var explicacaoCategoriaRamal    =   $('input[name=rd_categoriaRamal]:radio:checked').closest("span .fluigicon").data("content");

Alguem consegue me explicar porque não está dando certo? Tentei algumas variações disso sem sucesso.

2
  • Tenta assim var explicacaoCategoriaRamal = $('input[name=rd_categoriaRamal]:radio:checked').closest("span .fluigicon").attr("data-content"); Commented 22/03/2017 às 17:59
  • Infelizmente, assim não funciona. Dá undefined.
    – CarlosM
    Commented 22/03/2017 às 18:16

1 Resposta 1

2

Tens de subir no DOM até .input-group-addon, procurar o sibling .input-group-addon e depois procurar um descendente com data-content.

Poderia ser assim:

$(':checkbox').on('change', function() {
  var data = $(this)
    .closest('.input-group-addon')
    .nextAll('.input-group-addon:first')
    .find('[data-content]')
    .data('content');
  console.log(data);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group col-xs-12 col-sm-12 col-md-3 col-lg-3 space">
  <div class="input-group">
    <span class="input-group-addon">
        <input type="checkbox" id="cat5" name="rd_categoriaRamal" value="cat5" checked>
    </span>
    <label class="form-control" for="cat5">Cat. 5</label>
    <span class="input-group-addon"><span id="teste" class="fluigicon fluigicon-info-sign bs-docs-popover-hover" data-toggle="popover" title="" data-content="Ligações locais, celular e DDD." data-original-title="Popover title"><label class="form-control" for="cat5">Cat. 5</label></span></span>
  </div>
</div>

5
  • Entendi que ele queria pegar o valor dentro do atributo data-content, não? Com isso, sugiro a função .attr('data-content') do jQuery api.jquery.com/attr Commented 22/03/2017 às 18:08
  • 1
    @leonardopessoa Usar .data('content') vai pegar o atributo [data-content], como você pode ver aqui: api.jquery.com/data. Commented 22/03/2017 às 18:11
  • 1
    @leonardopessoa como o AP escreveu pegar o valor de um atributo achei esta a melhor solução. Não sei de .attr será a melhor solução por causa da maneira como o jQuery lê campos data-
    – Sergio
    Commented 22/03/2017 às 18:11
  • 1
    Compreendido. Obrigado pelo esclarecimento! Commented 22/03/2017 às 18:15
  • 1
    Excelente resposta, funcionou aqui. Eu tentei fazer algo parecido com o children sem sucesso. Vlw pela resposta.
    – CarlosM
    Commented 22/03/2017 às 18:18

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .