jQuery實現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作示例

更新時間：2018年07月13日 12:10:03 作者：ithouse

這篇文章主要介紹了jQuery實現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作,結(jié)合實例形式分析了jQuery針對select選中觸發(fā)change事件相關操作技巧,需要的朋友可以參考下

本文實例講述了jQuery實現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作。分享給大家供大家參考，具體如下：

jQuery代碼部分：

<script>
    $(document).ready(function(){
      var defaultId = "${defaultSelected}";
      var defaultTime = "${timeName}";
      $("select option").each(function(){
        if($(this).val()==defaultId || $(this).val()==defaultTime){
          $(this).attr("selected","selected");
        }
      });
      $("#all").change(function(){
        //alert(document.getElementById("allItem").selected);
        if(document.getElementById("allItem").selected == true){
          $("#timeText").hide();
          $("#timeSelect").hide();
        }else{
          $("#timeText").show();
          $("#timeSelect").show();
        }
      });
    });
</script>

HTML部分：

<form action="${baseUrl}/report/issueStatus.shtml">
  <span>Select a project:</span>
  <select name="selectedProId" id="all">
    <c:forEach items="${projectNameId}" var="pi">
      <option value="${pi.value}">${pi.key}</option>
    </c:forEach>
    <option value="-1" id="allItem">All</option>
  </select>
  <span id="timeText">Select a time horizon:</span>
  <select name="timeHorizon" id="timeSelect">
    <option value="Week">Last week</option>
    <option value="Month">Last month</option>
  </select>
  <button type="submit" id="submit">search</button>
</form>

更多關于jQuery相關內(nèi)容感興趣的讀者可查看本站專題：《jQuery常見事件用法與技巧總結(jié)》、《jQuery常用插件及用法總結(jié)》、《jQuery操作json數(shù)據(jù)技巧匯總》、《jQuery擴展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對大家jQuery程序設計有所幫助。

您可能感興趣的文章: