Question

我正在尝试在选择特定值时更改select标签中的两个div的css，所以你能看一下我的代码，我做错了吗？

$(document).ready(function() {
  $('#ads_site').change(function() {
    if ($(this).val() == 'boss.az') {
      $("#boss.az").css("display", "block");
    }
    elseif($(this).val() == 'jobsearch.az') {
      $("#jobsearch.az").css("display", "block");
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form method="post" action="process.php">
  <select name="ads_site" id="ads_site">
    <option value="boss.az">boss.az</option>
    <option value="jobsearch.az">jobsearch.az</option>
  </select>
  <div id="boss.az" style="display:none;">
    <center>
      <h3>::Ads To Be Added::</h3>
    </center>
    <br>
    <input type="text" class="from_page" name="from_page" placeholder="From Page No">
    <input type="text" class="to_page" name="to_page" placeholder="To Page No">
  </div>
  <div id="jobsearch.az" style="display:none;">
    <center>
      <h3>::Ads To Be Added::</h3>
    </center>
    <br>
    <input type="text" class="from_ad" name="from_page" placeholder="From Ad No">
    <input type="text" class="to_ad" name="to_page" placeholder="To Ad No">
  </div>
  <input type="submit" name="submit" class="login login-submit" value="Submit">
</form>

Answer 1

有两个问题：

JavaScript中没有elseif，您应该使用else if。

由于您的ID包含.，您应该转义它们，否则jQuery会尝试选择具有boss ID和az类名的元素。

$(document).ready(function () {
   $('#ads_site').change(function () {
      if ( this.value === 'boss.az' ) {
          $("#boss\\.az").show();
          // in case that you want to hide the other element
          //  $("#jobsearch\\.az").hide();
      }
      else if ( this.value === 'jobsearch.az' ) {
          $("#jobsearch\\.az").show();
      }
   });
});

Jquery更改功能不起作用？

1 个答案: