Javascript listindex事件处理_Javascript_Twitter Bootstrap_Dom_Event Handling_Dom Events

Javascript listindex事件处理

javascript twitter-bootstrap dom

Javascript listindex事件处理,javascript,twitter-bootstrap,dom,event-handling,dom-events,Javascript,Twitter Bootstrap,Dom,Event Handling,Dom Events,我试图基于DOM元素的listindex启动事件处理。我不太明白为什么代码不能工作，因为我在引导环境中运行它 Javascript: window.onload = function(){ function getEventTarget(e) { e = e || window.event; return e.target || e.srcElement; } var ul = document.getElementById("aloga"); ul.oncl

我试图基于DOM元素的listindex启动事件处理。我不太明白为什么代码不能工作，因为我在引导环境中运行它

Javascript:

 window.onload = function(){
 function getEventTarget(e) {
 e = e || window.event;
 return e.target || e.srcElement; 
 }
 var ul = document.getElementById("aloga");
 ul.onclick = function(event) {
 var target = getEventTarget(event);
 var bman = getElementsByTagName("option")
 if (target.selectedIndex == "0") {
    window.alert("Hello Peter")
 } else if (target.selectedIndex == "1") {
    window.alert("Hello Paul")
 } else {
    window.alert("Hello Penn")
 }
 };
 }

下面是HTML代码：

 <select name="aloga" data-placeholder="Select your aloga" id="aloga"      class="form-control input-lg select2">
 <option value="1" data-code="A" selected > Peter </option>
 <option value="2" data-code="B"> Paul </option>
 <option value="3" data-code="C"> Penn </option>
 </select>


彼得
保罗
佩恩

将

getElementsByTagName（“选项”）

更改为

文档。getElementsByTagName（“选项”）

用此替换javascript代码

document.getElementById("aloga").onchange = function(){
  var index = this.selectedIndex;
  var name = this.options[index].text;
  window.alert("Hello "+name);
}

jsiddle link

我同意brk的评论，但如果这不起作用，那么我将粘贴我的工作代码以供参考

注意：我已经将您的代码嵌入到函数attachEvents（）中，并且修改了 var bman=getElementsByTagName（“选项”）到 var bman=document.getElementsByTagName（“选项”），如下所示


函数attachEvents（）{
函数getEventTarget（e）{
e=e | | window.event；
返回e.target | | e.src元素；
}
var ul=document.getElementById（“aloga”）；
ul.onclick=功能（事件）{
var target=getEventTarget（事件）；
var bman=document.getElementsByTagName（“选项”）
如果（target.selectedIndex==“0”）{
window.alert（“你好，彼得”）
}否则如果（target.selectedIndex==“1”）{
window.alert（“你好，保罗”）
}否则{
window.alert（“你好，佩恩”）
}
};
}
下面是HTML代码：
彼得
保罗
佩恩

谢谢您查看。

        <html>
        <script> 
         function attachEvents(){
         function getEventTarget(e) {
         e = e || window.event;
         return e.target || e.srcElement; 
         }
         var ul = document.getElementById("aloga");
         ul.onclick = function(event) {
         var target = getEventTarget(event);
         var bman = document.getElementsByTagName("option")
         if (target.selectedIndex == "0") {
            window.alert("Hello Peter")
         } else if (target.selectedIndex == "1") {
            window.alert("Hello Paul")
         } else {
            window.alert("Hello Penn")
         }
         };
         }
         </script>
        Then here is the HTML code below:
        <body onload="attachEvents()">
         <select name="aloga" data-placeholder="Select your aloga" id="aloga"      class="form-control input-lg select2">
         <option value="1" data-code="A" selected > Peter </option>
         <option value="2" data-code="B"> Paul </option>
         <option value="3" data-code="C"> Penn </option>
         </select>
         </body>
         </html>