Jquery 破坏了一个 OnClick 函数答案

【问题标题】：Jquery Breaks an OnClick FunctionJquery 破坏了一个 OnClick 函数
【发布时间】：2014-02-05 14:14:15
【问题描述】：

我已经满意地使用了这样的提交按钮

<a href="javascript:void()" onclick="document.booking.submit()" class="buttonavail"></a>

一段时间。该类定义按钮的位置及其外观。

现在我在页面中添加了一个 Jquery 脚本，但该按钮不再起作用。脚本是

$(document).ready(function() {
    $("#tabcontent > div").hide(); // Initially hide all content
    $("#tabs li:first").attr("id","current"); // Activate first tab
    $("#tabcontent div:first").fadeIn(); // Show first tab content

    $('#tabs a').click(function(e) {
        e.preventDefault();
        if ($(this).closest("li").attr("id") == "current"){ //detection for current tab
         return       
        }
        else{             
        $("#tabcontent > div").hide(); //Hide all content
        $("#tabs li").attr("id",""); //Reset id's
        $(this).parent().attr("id","current"); // Activate this
        $('#' + $(this).attr('name')).fadeIn(); // Show content for current tab
        }
    });
$('#prices').load('../prices.php?hid=<?php echo $hid;?>');
});

大概这与在 href 中有“javascript:void()”有关，但我不明白为什么。有没有另一种编写href的方法来让这两个东西一起工作？

部分解决方案问题并不是我想的那样。最后我发现父页面和Jquery正在加载的页面都包含同名的a。重命名其中一种形式解决了这部分问题。

但是，现在我发现另一个问题似乎是 Jquery 的两个位之间的冲突。我在 Jquery - Scripts are conflicting

上问过另一个问题

【问题讨论】：

ancor 标签中没有任何文字
你在哪里放置这个javascript代码？
你试过去掉 void 语句看看会发生什么吗？
锚标记中没有文本，因为该类通过精灵合并了一个按钮。 javascript 代码位于页面的中。 “a href”在中。取出“void()”没有任何区别。从 href 中取出所有内容只会使页面在点击时重新加载。

标签： javascript jquery html

【解决方案1】：

如下改变函数。像我展示的那样在函数的最后一行添加提交

 $('#tabs a').click(function(e) {
        e.preventDefault();
        if ($(this).closest("li").attr("id") == "current"){ //detection for current tab
         return       
        }
        else{             
        $("#tabcontent > div").hide(); //Hide all content
        $("#tabs li").attr("id",""); //Reset id's
        $(this).parent().attr("id","current"); // Activate this
        $('#' + $(this).attr('name')).fadeIn(); // Show content for current tab
        }
        $(this).submit() **// ADD HERE**
    });

【讨论】：

是的，这实际上可能比我的答案更好 - 我没有意识到 OP 希望两者一起工作。 +1

【解决方案2】：

$('#tabs a').click 是你的问题。您正在使用此代码覆盖 <a> 标记的点击事件。

您可以将 jQuery 代码更新为：

$('#tabs a:not(.buttonavail)').click

【讨论】：

不是“$('#tabs a').click” 导致它。我有问题的“a href”不在“标签”div 中。但是，您让我想到了一条不同的路线，并且我尝试逐行删除脚本的某些部分。这样做我将问题隔离到“$（'#prices）.load”行，尽管我完全不知道为什么。任何进一步的想法将不胜感激。与此同时，我将继续摆弄，试图找到它的底部。
锚定按钮不在您正在重新加载的 div 中，是吗？如果您要替换 <a> 标记 - 即使使用相同的标记，它也会丢失引用并可能破坏点击事件
不，它们位于页面的完全不同的部分。但是，我发现通过使用不同的文件名代替prices.php，一切正常。所以我得出的结论是，prices.php 中有一些东西导致了这个问题。我现在正在解决这个问题，试图找到冲突。
如果 "prices.php" 文件有一个名为 booking 的 DOM 元素，您可能会遇到以下问题：onclick="document.booking.submit()"，因为现在页面上有两个 "booking" 元素
Askanison4 满分！你把钉子钉在了头上。我一直在鞭打prices.php，删除了一些代码，直到我最终将其放入带有名称booking 的表格中。我还没有修改文件并对其进行测试，但看起来很明显这就是问题所在。