0

我正在尝试获取单击源的元素，但我不知道为什么它不起作用。

JSFIDDLE

HTML：

<span class="populate" onclick="populate();" href="?id=1">Hello</span>

CSS：

.populate {
    cursor: pointer;
}

JS：

function populate(event) {
    var event = event || window.event;
    var src = event.srcElement;
    var href = src.getAttribute('href');
    alert(href);
}

我在控制台中看到的错误是未定义函数填充。

任何帮助或建议将不胜感激！

4

5 回答 5

2

问题在于 javascript 和 span 标签的顺序。

将javascript函数放在标签之前

JS

    function populate(event) {
        var event = event || window.event;
        var src = event.srcElement;
        var href = src.getAttribute('href');
        alert(href);
    }

html

<span class="populate" onclick="populate();" href="?id=1">Hello</span>

我们需要在调用它们之前定义函数。在这里 摆弄 http://jsfiddle.net/HdvGD/7/

于 2013-07-19T13:05:58.207 回答
1

您的代码在小提琴中工作正常。你没有得到它的原因是你包裹在 onload() 中而不是这样做No wrap in Head（左上角的小提琴）

你的小提琴1

如果您想在 onload() 中分配类似变量

populate = function (event) {
    var event = event || window.event;
    var src = event.srcElement;
    var href = src.getAttribute('href');
    alert(href);
}

检查是小提琴2

检查这个[答案找出区别]

更新：

抱歉指出折旧的一个（我删除了它）。事件对象“event”不是从参数传递的。实际上这是一个简单的传递事件的onclick方法

 onclick="populate(event);"

然后简单地传递它并像下面一样访问

 function populate(event) {
    var src = event.target || event.srcElement;
    var href = src.getAttribute('href');
    alert(href);
}

最后的小提琴

于 2013-07-19T13:06:56.607 回答
0

使用 jquery 让它工作起来很简单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

     <script type="text/javascript">            

        $(document).ready(function() {
            $("#populate").click(function(event) {
                alert("As you can see, the link no longer took you to jquery.com");
                var href = $('#populate').attr('href');
                alert(href);
                event.preventDefault();
            });
        });



        </script>
</head>

<body>

<span class="populate" id="populate" onclick="populate();" href="?id=1" >Hello</span>
</body>
</html>
于 2013-07-19T13:03:29.033 回答
0

锚标签包含href属性

 <a class="populate" id="link" onclick="populate(this.id);" href="......">Hello
</a>



   function populate(id)
   {
       var someimage = document.getElementById(id);
       var mysrc = someimage .src;

   }
于 2013-07-19T12:57:31.220 回答
0

您的小提琴工作正常，在左侧，第二个下拉菜单，更改为No Wrap - In <head>，现在您的内容在那里并且脚本已加载。再试一次：http: //jsfiddle.net/HdvGD/4/

于 2013-07-19T13:06:13.897 回答