参数在 $(） - jQuery 之外不起作用

Parameter won't work outside of $() - jQuery

本文关键字：jQuery 不起作用 参数      更新时间：2023-09-26

我有一个简单的 AJAX 脚本，我很好奇为什么该参数在块之外不起作用$()：

var loadWork = function(el) { //element which href will be used
    var url = $(el).attr('href'); //it doesn't work if 'el' is not in $()
    $.get(url, function(data) {
        $('#work-gallery').html(data);
    });
}
$(document).ready(function() {
    loadWork('#work ul li a[href="includes/wdes.html"]')
    $('#work ul li a').click(function(evt) {
        evt.preventDefault();
        var element = $(this);
        loadWork(element);
    });
});

loadWork函数的el（元素的缩写）参数需要位于表达式*var url = ...* $()内。为什么当我在函数调用中将其作为变量或文字元素传递时？

你传递一个字符串，所以如果你不把它包装成$()它只是一个字符串，所以类似于 

'#work ul li a[href="includes/wdes.html"]'.attr('xyz')

但这是无稽之谈，因为.attr方法是jqueryObjects的属性，所以使用 

$('#work ul li a[href="includes/wdes.html"]')

将选择匹配的 domnode 并将它们包装为 jquery 对象，以便您可以运行 jquery 方法，如 .attr（）

您要执行的操作：

"单击#work内的链接时，加载该链接href返回到#work-gallery的任何内容。

对于简单的内容加载作业，有.load() jQuery函数，它接受一个URL并将返回的HTML放在一个元素中 - 就像你在loadWork()函数中所做的那样。所以让我们划伤这个功能，它是多余的。

其次，您希望最初加载一些内容。最简单的方法是简单地在其中一个链接上触发单击事件，因为我们已经有了正确的单击处理程序。

$(document).ready(function() {
    $('#work a').click(function (e) {
        e.preventDefault();
        $('#work-gallery').load(this.href);
    }).first().click();
});

请注意事件处理程序内部的this如何指向 DOM 对象，因此您可以直接使用 this.href，而不是绕道调用 .attr('href') 。

相关文章：