Question

我在锚标签内有一个按钮，按钮点击冒泡到锚标签，锚标签导航到指定的href。我尝试了event.stopPropagation（）和event.cancelBubble但它没用。请建议我解决方案..

function deleteTask(event, taskId) {

            if (event.stopPropagation) {
                event.stopPropagation();
            }
            else if(event.cancelBubble){
                event.cancelBubble = false;
            }
            $.jqmConfirmation("Delet Task", "Delete task " + taskId +Delete);

            function Delete(button) {
                if (button == "1") {
                    taskList.deleteTaskUsingId(taskId);
                }
            };
        }
<li>
 <a class="ui-btn text-left ui-corner-all" href="GroupTaskViewEdit.html#?      id={{id}}&type={{type}}"  rel="external">

                      <span class="order-number"><b>{{id}}</b></span>

                      <button class="order-number btn" onclick="deleteTask(event,{{id}});" aria-label="Delete">
                                   <i class="fa fa-trash-o" aria-     hidden="true"></i>
                      </button>

Answer 1

尝试使用return false。如果您在jquery中使用.live，这甚至可能有用。

Answer 2

我发现这个答案。它的工作正常。我应该用 event.stopPropagation（）; event.preventDefault（）;

stopPropagation会阻止事件冒泡，在这种情况下，您仍然单击链接，因为它包装了span，因此您需要阻止浏览器执行其默认操作。

Answer 3

您只需在链接中使用return false;：<a href="#" onclick="deleteTask(); return false;">Delete</a>

另外，使用标准的jQuery Mobile Split Buttons：http://demos.jquerymobile.com/1.4.5/listview/#Splitbuttons

演示：https://jsfiddle.net/m1na322y/

停止锚标记中按钮的事件冒泡

3 个答案: