点击事件弹出警报消息

Question

我正在尝试从.cshtml文件内部调用按钮点击事件: ```

我正在尝试从.cshtml文件内部调用按钮点击事件:

```

  <input type="button" id="ImageHosting" value="To Image Hosting" onclick="ImageHosting_Click()"/> 

这是.js文件：

 function ImageHosting_Click() {
               $("#ImageHosting").click(function () {
                   alert("test");
               });
       }

我无法获取警告消息。有什么想法吗？

- GoldenUser

Answer 1

你正在HTML中内联绑定事件处理程序，同时你又在函数中使用jQuery再次绑定，这是不正确的。

只需删除内联onclick即可。

<input type="button" id="ImageHosting" value="To Image Hosting" />

改变JS代码

$(document).ready ( function () {
    $("#ImageHosting").click(function () {
       alert("test");
    });
});

如果此按钮是动态插入的，则：

$(document).ready ( function () {
    //replace document below with enclosing container but below will work too
    $(document).on('click', "#ImageHosting", function () {
       alert("test");
    });
});

如果你使用的是 jQuery 的旧版本（ < 1.7），请使用 .live/.delegate。

- Selvakumar Arumugam

---

@GoldenUser 我能想到三种可能的情况，1. 你可能有一个脚本错误..所以请检查你的错误控制台。2. 你可能正在动态添加按钮，在这种情况下，你需要根据jQuery版本使用.on或.live/.delegate。3. 你可能有相同按钮的重复ID，请检查一下。 - Selvakumar Arumugam

我没有收到任何JavaScript错误。我已经尝试了提到的两种解决方案，但都没有起作用！ - GoldenUser

好的 - 这可能听起来很疯狂，但我使用Firebug运行了.js文件并得到了警报。我关闭它并重新运行我的应用程序，现在我可以收到警报了！谢谢你们的帮助。 - GoldenUser

Answer 2

与SKS的回答相反（保留内联onclick属性）：

<input type="button" id="ImageHosting" value="To Image Hosting" onclick="ImageHosting_Click()"/>

And

function ImageHosting_Click(){
    alert("test");
}

甚至可以全部合并为一个：

<input type="button" id="ImageHosting" value="To Image Hosting" onclick="alert('test');"/>

- c24w

Answer 3

// Try like this:

$("#ImageHosting").click(function() {
  alert("test");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" id="ImageHosting" value="To Image Hosting" />

- Torrent Lee