简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > php教程 > PHP开发 > le corps du texte

jquery选择select下拉菜单option项触发事件

高洛峰
Libérer： 2016-12-15 16:14:30
original
1826 Les gens l'ont consulté

jquery实现的选择select下拉菜单option项触发事件:
在很多应用中，选中一个select下拉选项就会触发一个事件，执行相应的操作。
下面就通过代码实例介绍一下如何利用jquery实现此功能，代码如下:

<!DOCTYPE html><html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function () { 
  $("#sel").bind("change",function(){ 
    if($(this).val()==0){
      return; 
    } 
    else{
      $("#thediv").text($(this).val());
    } 
  }); 
});
</script> 
</head> 
<body>
<div id="thediv"></div>
<select id="sel">
  <option value="0">-请选择-</option> 
  <option value="1">蚂蚁部落一</option> 
  <option value="2">蚂蚁部落二</option> 
  <option value="3">蚂蚁部落三</option> 
  <option value="4">蚂蚁部落四</option> 
</select>
</body>
</html>
Copier après la connexion

上面的代码选中出去第一项以外的所以选项都可以把value值写入div中。


更多 jquery选择select下拉菜单option项触发事件相关文章请关注PHP中文网！


Étiquettes associées：
jquery select下拉菜单
source：php.cn
Article précédent：一个jQuery下拉菜单，代码简单 Article suivant： jQuery 下拉菜单操作总结
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Menu déroulant central dans la barre de navigation Utilisez CSS/HTML.navbar{width:100%;background-color:rgb(151,44,44);overflow:auto;}.navbar...
Depuis 2024-04-04 18:24:52
0
1
338
Personnalisez l'apparence de Select2 Dropdown Dans mon cas, j'utilise select2Combobox pour mon menu déroulant. Ici, lorsque la sélection...
Depuis 2024-04-03 11:27:22
0
1
338
Ma liste déroulante bootstrap 4 ne fonctionne pas et je ne sais pas comment y remédier Je suis très nouveau en HTML et j'essaie depuis des heures de faire fonctionner mon menu d...
Depuis 2024-04-02 18:12:59
0
1
283
Assurez-vous que la liste déroulante apparaît toujours au-dessus de son parent, position : relative J'essaie de réaliser quelque chose comme ci-dessous. Le conteneur contient un ensemble de ...
Depuis 2024-04-01 18:43:16
0
1
316
Vue : transition du menu déroulant et comment changer de classe d'un autre élément J'ai eu ceci (très simple) : <divclass="dropdownMenuWrapper"><ulclass=&...
Depuis 2024-03-31 21:34:34
0
1
370
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！