text()不会附加到同一行的第二个<span>

Question

jQuery text()函数不会option从选择字段追加到span.我有两个select相同的字段div.它们是不同的,包含动态创建的数字.

function myFunction(selector) {
    var i;
    for (i = 1; i <= 999; i++) {
      var text = '00' + i;
      selector.options[i - 1] = new Option(text.substr(text.length - 3, 3));
    }
  }
  //usage:
myFunction(document.getElementById("patient_code"));

$('#patsiendikoodi_label #patient_code ').change(function(i, text) {
  var $this = $(this);
  $this.prev().find('.patsiendikoodi_label_nr').text($(this).find('option:selected').text());
}).change();



function patsient(selector) {
    var i;
    for (i = 1; i <= 99; i++) {
      var text = '0' + i;
      selector.options[i - 1] = new Option(text.substr(text.length - 2, 2));
    }
  }
  //usage:
patsient(document.getElementById("patient_code2"));

$('#patsiendikoodi_label #patient_code2 ').change(function(i, text) {
  var $this = $(this);
  $this.prev().find('#patsiendi_kood').text($(this).find('option:selected').text());
  console.log("WRITTEN");
}).change();

<div id="patsiendikoodi_label" class="col-sm-10">
  <label class="control-label">Kood:</label>
  <h4 style="color: #0DD31B; font-weight: bold;"><span id="ravimi_nimi"></span><?php foreach( $result as $row ){echo $row['user_code']; }?>- <span class="patsiendikoodi_label_nr"></span><span id="patsiendi_kood">-</span></h4>

  <select data-placeholder="" id="patient_code" class="chosen-select form-control" tabindex="2">
  </select>

  <select data-placeholder="" id="patient_code2" class="chosen-select form-control" tabindex="2">
  </select>

</div>

我正在option从JavaScript 生成值.如果我将第二个select字段放在另一个div中,它会将所选选项附加到范围.这张照片应该比我的解释更好.

但无论我做什么,都不会添加文字.

Answer 1

在第二个处理程序中,prev()找到前一个select元素,而不是h4您要搜索的元素.

使用prevAll('h4');发现的元素.

$('#patient_code2').change(function(i, text) {
  var $this = $(this);
  $this.prevAll('h4').find('#patsiendi_kood').text($(this).find('option:selected').text());
  console.log("WRITTEN");
}).change();

function myFunction(selector) {
    var i;
    for (i = 1; i <= 999; i++) {
      var text = '00' + i;
      selector.options[i - 1] = new Option(text.substr(text.length - 3, 3));
    }
  }
myFunction(document.getElementById("patient_code"));

$('#patient_code').change(function(i, text) {
  var $this = $(this);
  $this.prev().find('.patsiendikoodi_label_nr').text($(this).find('option:selected').text());
}).change();


function patsient(selector) {
    var i;
    for (i = 1; i <= 99; i++) {
      var text = '0' + i;
      selector.options[i - 1] = new Option(text.substr(text.length - 2, 2));
    }
  }
patsient(document.getElementById("patient_code2"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="patsiendikoodi_label" class="col-sm-10">
  <label class="control-label">Kood:</label>
  <h4 style="color: #0DD31B; font-weight: bold;"><span id="ravimi_nimi"></span><?php foreach( $result as $row ){echo $row['user_code']; }?>- <span class="patsiendikoodi_label_nr"></span><span id="patsiendi_kood">-</span></h4>

  <select data-placeholder="" id="patient_code" class="chosen-select form-control" tabindex="2">
  </select>

  <select data-placeholder="" id="patient_code2" class="chosen-select form-control" tabindex="2">
  </select>

</div>

当然,因为ids在文档中是唯一的,所以你可以真正地说:

$('#patsiendi_kood').text( $(this).find('option:selected').text() );