这个脚本有什么问题吗?

时间:2018-05-06 11:57:49

标签: jquery

https://jsfiddle.net/Ld5s4jLw/1/

我无法弄清楚这有什么问题,它不起作用,我尝试了很多东西但却无法使它工作......

function toggleAutre(bloc) {
  if ($('#' + bloc + '_oui').is(':checked')) {
    $('#' + bloc + '_texte').show('slow');
    alert('Oui');
  } else if ($('#' + bloc + '_non').is(':checked')) {
    $('#' + bloc + '_texte').hide('slow');
    alert('Non');
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col">
  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_oui" value="1" onclick="toggleAutre('nbre_poste_inoccupe');" />
    <label class="form-check-label" for="nbre_poste_inoccupe_oui">OUI</label>
  </div>
  <div class="form-group" id="nbre_poste_inoccupe_text_div" style="display: none;">
    <label for="nbre_poste_inoccupe_text" style="font-size: 0.7em; font-weight: 400;">Si OUI, combien ?</label>
    <input class="form-control" type="number" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_text" style="width: 5em;" value="1" onclick="toggleAutre('nbre_poste_inoccupe');" />
  </div>
</div>
<div class="col">
  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_non" value="0">
    <label class="form-check-label" for="nbre_poste_inoccupe_non">NON</label>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

如果我理解正确,您要显示的动态id不正确。您正在使用选择器(计算后,对吗?)#nbre_poste_inoccupe_texte来查找div nbre_poste_inoccupe_text_div。只需修好它就会对你有用。

&#13;
&#13;
function toggleAutre(bloc) {
  if ($('#' + bloc + '_oui').is(':checked')) {
    console.log('#' + bloc + '_texte_div');
    $('#' + bloc + '_text_div').show('slow');
    alert('Oui');
  } else if ($('#' + bloc + '_non').is(':checked')) {
    $('#' + bloc + '_texte').hide('slow');
    alert('Non');
  }
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col">
  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_oui" value="1" onclick="toggleAutre('nbre_poste_inoccupe');" />
    <label class="form-check-label" for="nbre_poste_inoccupe_oui">OUI</label>
  </div>
  <div class="form-group" id="nbre_poste_inoccupe_text_div" style="display: none;">
    <label for="nbre_poste_inoccupe_text" style="font-size: 0.7em; font-weight: 400;">Si OUI, combien ?</label>
    <input class="form-control" type="number" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_text" style="width: 5em;" value="1" onclick="toggleAutre('nbre_poste_inoccupe');" />
  </div>
</div>
<div class="col">
  <div class="form-check form-check-inline">
    <input class="form-check-input" type="radio" name="nbre_poste_inoccupe" id="nbre_poste_inoccupe_non" value="0">
    <label class="form-check-label" for="nbre_poste_inoccupe_non">NON</label>
  </div>
</div>
&#13;
&#13;
&#13;