JavaScript on change 函数工作得不好

JavaScript on change function working not well

本文关键字：工作 函数 on change JavaScript      更新时间：2023-09-26

我有一个与HTML选择标签一起使用的JavaScript代码。

$(function() {
  $('#to_name').on('change',function() {
    if( $(this).val()=="<?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?>") {
      $('#to_designation').val('<?php echo $ceo_chunks[3];?>');
      $('#dear_sir').val('<?php echo $ceo_chunks[0]?> <?php echo $ceo_last_name;?>') ;
      if( $(this).val()=="<?php echo $liaison_one_chunks[0];?> <?php echo $liaison_one_chunks[1];?> <?php echo $liaison_one_chunks[2]?>") {
        $('#to_designation').val('<?php echo $liaison_one_chunks[3]?>')
        $('#dear_sir').val('<?php echo $liaison_one_chunks[0]?> <?php echo $liaison_one_last_name;?>')
        $("#liaison_one").show()
        $("#dear_liaison_one").show()
      } else {
        $("#ceo").hide()
        $("#liaison_two").hide()
        $("#dear_ceo").hide()
        $("#dear_liaison_two").hide()
      }
      if( $(this).val()=="<?php echo $liaison_two_chunks[0];?> <?php echo $liaison_two_chunks[1];?> <?php echo $liaison_two_chunks[2]?>") {
        $('#to_designation').val('<?php echo $liaison_two_chunks[3]?>')
        $('#dear_sir').val('<?php echo $liaison_two_chunks[0]?> <?php echo $liaison_two_last_name;?>')
        $("#liaison_two").show()
        $("#dear_liaison_two").show()
      } else {
        $("#ceo").hide()
        $("#liaison_one").hide()
        $("#dear_ceo").hide()
        $("#dear_liaison_one").hide()
      }
    };
  });
});

这是 HTML 代码

<select name="to_name" id="to_name">
        <option value="<?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?>"><?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?></option>
        <option value="<?php echo $liaison_one_chunks[0];?> <?php echo $liaison_one_chunks[1];?> <?php echo $liaison_one_chunks[2]?>"><?php echo $liaison_one_chunks[0];?> <?php echo $liaison_one_chunks[1];?> <?php echo $liaison_one_chunks[2]?></option>
        <option value="<?php echo $liaison_two_chunks[0];?> <?php echo $liaison_two_chunks[1];?> <?php echo $liaison_two_chunks[2]?>"><?php echo $liaison_two_chunks[0];?> <?php echo $liaison_two_chunks[1];?> <?php echo $liaison_two_chunks[2]?></option>
      </select>

        <br>
        <select name="to_designation" id="to_designation">
        <option value="<?php echo $ceo_chunks[3]?>" id="ceo"><?php echo $ceo_chunks[3]?></option>
        <option value="<?php echo $liaison_one_chunks[3]?>" id="liaison_one"><?php echo $liaison_one_chunks[3]?></option>
        <option value="<?php echo $liaison_two_chunks[3]?>"id="liaison_two"><?php echo $liaison_two_chunks[3]?></option>
      </select>

<div id="dear_ceo" style="margin-top:10px; width:auto">
      <input type="text" name="dear_sir" id="dear_ceo" value="Dear <?php echo $ceo_chunks[0]?> <?php echo $ceo_last_name;
?>"/>
      </div>
      <div id="dear_liaison_one" style="margin-top:10px; width:auto; display:none">
        <input type="text" name="dear_sir" id="dear_liaison_one" value="Dear <?php echo $liaison_one_chunks[0]?> <?php echo $liaison_one_last_name;?>"/>
      </div>
      <div id="dear_liaison_two" style="margin-top:10px; width:auto; display:none">
        <input type="text" name="dear_sir" id="dear_liaison_two" value="Dear <?php echo $liaison_two_chunks[0]?> <?php echo $liaison_two_last_name;?>"/>
      </div>

我的函数非常适合选择标签，但它不适用于输入类型文本。

我该如何解决这个问题？

您的第一个 if 语句明显缺少一个右括号。请合上支架。代码中没有逻辑错误。

 $(function() {
      $('#to_name').on('change',function(){

      if( $(this).val()=="<?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?>"){
        $('#to_designation').val('<?php echo $ceo_chunks[3];?>')
        $('#dear_sir').val('<?php echo $ceo_chunks[0]?> <?php echo $ceo_last_name;?>')
        /*$("#ceo").show()
        $("#dear_ceo").show()*/
    //}    ---uncomment this ---

还要在每次调用函数时包括一个终止分号。例如

 if( $(this).val()=="<?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?>"){
        $('#to_designation').val('<?php echo $ceo_chunks[3];?>');
        $('#dear_sir').val('<?php echo $ceo_chunks[0]?> <?php echo $ceo_last_name;?>');
    }

我建议你在行尾使用分号（在适当的时候）。我知道它们不是强制性的，但认为它们是一种很好的做法。

在末尾的 if 子句末尾还有一个分号。它可能没有刹车任何东西，但以防万一...

尝试用下划线 （_） 替换空格。

例如：

<?php echo $ceo_chunks[0];?> <?php echo $ceo_chunks[1];?> <?php echo $ceo_chunks[2]?>

会成为

<?php echo $ceo_chunks[0];?>_<?php echo $ceo_chunks[1];?>_<?php echo $ceo_chunks[2]?>

并检查是否可以正确提醒更改输入的值。

相关文章：