2

我的代码中有这个：

<div class="someClass">
    <div id="22" class="otherClass" onclick="goToEdit();">Title</div>
    <div class="parent">Other title</div>
</div>

和：

function goToEdit()
{
    tree.selectItem($(event.target).attr('id'));
    btnMyButton_onclick();
}

在 Chrome 中一切正常，但在 Mozilla 中，它不会对点击事件做出反应。为什么？

4

6 回答 6

2

我收到未定义事件的错误

嗬！我们都应该意识到。

问题是这event在大多数浏览器上不是全局的，尽管它在 IE 上，并且 Chrome 通过使其成为全局以及做它应该做的事情（将它传递到事件处理函数）向为 IE 设计的网站抛出了一块骨头。

到目前为止，您最好的选择是根本不使用onclick="code"（见下文），但您也可以这样做：

<div id="22" class="otherClass" onclick="goToEdit(event);">Title</div>

...应该可以跨浏览器工作。它之所以有效，是因为该event对象是在调用处理程序的特殊上下文中定义的onclick（在以标准方式执行此操作的浏览器上），或者它是一个全局对象（在 IE 上），因此无论哪种方式，它都是在该点定义的（但不一定，作为一个全局的，稍后在你的goToEdit函数中——这就是我们将它作为参数传递的原因）。

但同样，我不会那样做。相反，我会通过让id值以字母开头来使值对 CSS 有效，并使用 jQuery 连接处理程序：

HTML：

<div id="d22" class="otherClass">Title</div>

JavaScript：

$("#d22").click(goToEdit);
function goToEdit(event) {
    tree.selectItem(event.target.id.substring(1));
    btnMyButton_onclick();
}

笔记：

  • 在传递它之前，我从值d的开头删除了id它。我想这是22有原因的。
  • 没有理由这样做$(event.target).attr('id')，直接使用event.target.id。

  • 如果div可能包含其他元素（spans、ems、ps 等），请注意event.target可能不是div，它可能是 的后代元素div。this不过，将永远是div（jQuery 看到），所以：

    $("#d22").click(goToEdit);
function goToEdit(event) {
    tree.selectItem(this.id.substring(1));
    btnMyButton_onclick();
}
于 2012-04-18T12:25:19.167 回答
1

尝试将元素的引用传递给函数。

 ... onclick="goToEdit(this);">

和

function goToEdit(element)
    {
       tree.selectItem($(element).attr('id'));
       btnMyButton_onclick();
    }

编辑：http: //jsfiddle.net/SwUuE/4/

于 2012-04-18T12:13:11.443 回答
0

HTML 名称和 ID 标记必须以字母开头。你有id="22". 也许它会导致浏览器之间的不一致。见：http ://www.w3.org/TR/html4/types.html

于 2012-04-18T12:05:29.063 回答
0

根据定义，div 用于将您的页面划分为不同的部分。改为使用带有类型按钮标签的锚点或输入

于 2012-04-18T12:12:02.493 回答
0

我认为，您可以从 html 中删除“onclick”

<div class="someClass">
    <div id="22" class="otherClass">Title</div>
    <div class="parent">Other title</div>
</div>

然后尝试这样的事情

$('#22').on('click', function (e) {
    your code
});

但是如果你的 div id="22" 将被动态添加，你应该使用这样的东西

$('parent').on('click', '#22', function (e) {
    your code
});

where 'parent' - 静态元素在单击之前已存在于文档中

于 2016-08-24T10:05:46.173 回答
0

我也面临同样的问题，但这段代码帮助了我。

我在 Mozilla Firefox 和 Chrome 上进行测试，两者都可以。

<input type="button" onclick="return goBack();" class="btn btn-warning cancel" value=" Cancel" style="color:white" />

<script>
function goBack() {
    window.history.back();
}
</script>
于 2017-07-07T07:29:36.060 回答