DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery入門技巧 >> 基於jQuery的select下拉框選擇觸發事件實例分析
基於jQuery的select下拉框選擇觸發事件實例分析
編輯:JQuery入門技巧     

本文實例講述了基於jQuery的select下拉框選擇觸發事件實現方法。分享給大家供大家參考,具體如下:

我一直以來都認為,select 下拉框選擇對選項 options 使用 onclick 注冊事件即可,如下:

<select>
  <option value="0" onclick="func(0)">選項一</option>
  <option value="1" onclick="func(1)">選項二</option>
</select>

今天有個要求需要做聯動菜單,就是每點一次,相鄰的下拉框會自動改變 ,我一想沒問題啊,onclick走起

於是走上面的路線,客戶還說了,IE8必須支持,我想想也是,XP的IE內核只能升到IE8,現在很多用戶依然捨不得XP,但是它支持onclick啊,我在ff下試過了,一點問題沒有,但是一切換IE8下,告訴你,一點反應沒有。

然後多方查找資料,原來select 它的事件是注冊在自己標簽上的,不是onclick,而是onchange,子標簽對低版本浏覽器無效,而且也不是正規標准的寫法。

<select onchange="func()>
  <option value="0" >選項一</option>
  <option value="1" >選項二</option>
</select>

好,問題又來了,我傳的參數怎麼辦?怎麼接收參數
這不是問題,jQuery給你答案

function func(){
 //獲取被選中的option標簽
 var vs = $('select option:selected').val();
}

當然這裡的 select 最好加個id 以便混淆,ok,問題解決,漲姿勢了木有呢,哈哈。。。

更多關於jQuery相關內容感興趣的讀者可查看本站專題:《jQuery表單(form)操作技巧總結》、《jQuery窗口操作技巧總結》、《jQuery拖拽特效與技巧總結》、《jQuery常用插件及用法總結》、《jquery中Ajax用法總結》、《jQuery表格(table)操作技巧匯總》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》

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

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved