如何停止弹出警报传播?

时间:2014-06-09 13:55:29

标签: javascript jquery html

我不知道如何用英语解释这个;-) 如果我为每个选项选择一个选项警报显示,我不知道如何停止。

步骤1,选择“aaaa”选项,例如 1111警报......

步骤2,选择选项“bbbb”为例 1111警报...... 2222警报......

等等!

我尝试过return,stopPropagation等。 纠正你肯定是一个容易犯的错误......: - )

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-  1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

<script>
   $(document).ready(function(){
       $('#myList').on('click', 'li', function(e) 
        {
            var pos = $(this).attr('pos');
            $("#myPopup").popup('open');

            $('#myPopup').on('click', 'ul li a', function(ev)
            {
                var popupValue = $(this).attr('info');
                alert('option-->' + popupValue);
                $('#myPopup').popup('close');
            }); 
        });     
});
</script>
</head>
<body>

<div data-role="page">


<div data-role="content" class="ui-content">

<a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all">Choose an option...</a>

<div data-role="popup" id="myPopup">
  <ul id="myList" data-role="listview" data-inset="true" style="min-width:250px;">
    <li><a href="#" info="1111">aaaaaaa</a></li>
    <li><a href="#" info="2222">bbbbbbb</a></li>
    <li><a href="#" info="3333">cccccc</a></li>
</ul>
</div>
</div>


</body>
</html>

1 个答案:

答案 0 :(得分:1)

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-  1.4.2.min.css">
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

<script>
   $(document).ready(function(){
       $('#myList').on('click', 'li', function(e) 
        {
            var pos = $(this).attr('pos');
            $("#myPopup").popup('open');

            $('#myPopup').off().on('click', 'ul li a', function(ev)
            {
                var popupValue = $(this).attr('info');
                alert('option-->' + popupValue);
                $('#myPopup').popup('close');
            }); 
        });     
});
</script>
</head>
<body>

<div data-role="page">


<div data-role="content" class="ui-content">

<a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all">Choose an option...</a>

<div data-role="popup" id="myPopup">
  <ul id="myList" data-role="listview" data-inset="true" style="min-width:250px;">
    <li><a href="#" info="1111">aaaaaaa</a></li>
    <li><a href="#" info="2222">bbbbbbb</a></li>
    <li><a href="#" info="3333">cccccc</a></li>
</ul>
</div>
</div>


</body>
</html>