事件冒泡问题与表单

时间:2015-09-04 08:23:51

标签: javascript jquery html event-bubbling

我在jQuery中遇到了这个事件冒泡问题。 我找到了一些解决方案但不适用于'select'标签。 所以我的父标签是一个手风琴顶部栏,触发内部的内容。 我遇到的问题是我需要右侧栏中的下拉菜单。

我尝试了event.stopPropagation();但没有运气。

<ul class="accordion" data-accordion>

  <li class="accordion-navigation">
      <a href="#comp1">Title

        <div class="deelcompetentiescoreBox">
          <span class="label"><i>A</i></span>
           <select class="deelcompetentieDropDown" onchange="javascript:assigndelibscore()">
            <option value="7" >AA</option>
            <option value="8" selected="selected">A</option>
            <option value="9">B</option>
            <option value="10">C</option>
          </select>
        </div>

      </a>

    <div id="comp1" class="content">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
      quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
      consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
      cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
      proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
    </div>
  </li>
</ul>

我在这里有截图 https://www.evernote.com/l/AAJPx_N0H75E4LzG5ZuwE4Gu-DVBK-nJojE

任何看到解决方案的人。

非常感谢。 哈罗德。

1 个答案:

答案 0 :(得分:0)

HTML

<select id="mySelection" class="deelcompetentieDropDown">

Javascript部分

 document.getElementById('mySelection').addEventListener('change', assigndelibscore);

不要忘记在e函数中添加参数assigndelibscore

 var assigndelibscore = function(e){
   e.stopPropagation();
 }