javascript - 如何创建将返回 jQuery 方法 attr 值的函数

Question

我有 html 结构:

<div>
    <ul>
        <li><img src="img/product1.png" alt="product1"></li>
        <li><img src="img/product2.png" alt="product2"></li>
        <li><img src="img/product3.png" alt="product3"></li>
        <li><img src="img/product4.png" alt="product4"></li>
    </ul>
</div>

我已经尝试创建函数，它将获取当前 img 元素的属性，我想从此函数返回当前属性，我有下一个代码:

var sr = "";
function imgSrc(){
   $('div').on("click", "ul li img", function () {
        sr = $(this).attr("src");
        return sr;
    });
}

console.log(imgSrc());

不幸的是，我在控制台中得到了 undefined。

Answer 1

您的函数不返回任何内容。它只是定义了一个 onClick 处理程序。所以这就是为什么你得到 'undefined' 的返回值

如果您打算在单击 div 时记录它的 src，则您的代码需要更像这样...

$('div').on("click", "ul li img", function () 
{
    var sr = $(this).attr("src");
    console.log(sr);
});

在元素上注册事件监听器。

但是，如果您想将监听器包装在一个函数中，然后像您所做的那样调用该函数，那也将起作用 - on("click") 中的函数将在单击元素时被触发。 sr 的值将被设置，但外部函数本身不会返回值。您需要在 on("click") 的函数中找到另一种方法来使用 sr 的值执行某些操作