问一下jquery函数操作[重复]答案

【问题标题】：Ask about jquery function operation [duplicate]问一下jquery函数操作[重复]
【发布时间】：2020-11-03 17:17:49
【问题描述】：

我是学生，不久我就开始学习编程了。为了解释，下面的代码比实际代码简化了。 'test()' 实际上是获取数据的 Ajax 函数。我的目标是为分页操作制作“标签”。但是当我点击'a tag'时，'$（document）.ready'内部的'test（）'在'a tag'点击事件发生后被调用。所以页面总是回到1。我不知道为什么会这样。任何人都可以帮助我吗？谢谢！

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript">
var page = 1;
$(document).ready(function(){
    test();
    alert(page);
});
function test(){
    for(var i = 1; i <= 3; i++) {
        var a = $("<a></a>").text(i).attr({
            href: "",
            idx: i
        });
        a.preventDefault;
        $(a).click(function(){
            page = $(this).attr("idx");
            test();
            alert(page);
        });
        $("#pageLink").append(a," ");
    }
}
</script>
</head>
<body>
hello!
<div id="pageLink"></div>
</body>
</html>

【问题讨论】：

不是问题的一部分，但 a 已经是一个 jQuery 对象，你不需要再用 $() 包装它。
我解决了问题。感谢您提供有关 jQuery 对象不需要用'$()' 包装它的建议。我不知道。

标签： javascript html jquery

【解决方案1】：

由于某种原因，您在 test() 内部调用了 test()。您还需要更改一些小事情

为 jQuery 对象加上 $ 前缀。 var $a=... 避免歧义。
preventDefault 用于事件，而不是 jQuery 对象。 $a.click(function(event){event.preventDefault();...});

否则它会按照我认为你想要的那样工作，在点击时提醒页码。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    createLinks();
});
function createLinks(){
    for(var i = 1; i <= 3; i++) {
        var $a = $("<a></a>").text(i).attr({
            href: "",
            idx: i
        });
       
        $a.click(function(event){
            event.preventDefault();
            page = $(this).attr("idx");
            // why are you calling this again? // test();
            // maybe you want to load something // loadSomething(page);
            alert(page);
        });
        $("#pageLink").append($a," ");
    }
}
</script>
</head>
<body>
hello!
<div id="pageLink"></div>
</body>
</html>

【讨论】：

感谢您的友好回答！！我的错是使用“preventDefault”方法来“标记”而不是“事件”。所以'href=""'被操作，网页被刷新，页面回到1。再次感谢你，祝你有美好的一天:)