Question

我有一个提交按钮，似乎可以在Chrome中点击，但不能在FF或IE中点击。任何帮助，将不胜感激！我觉得按钮的格式不正确。

  <button> <img src="http://button_image.png" onclick="mySubmit();" ></button>

附在mySubmit上的JQ是：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

<script>
function mySubmit(){
    var myForms = $("form");
    myForms.each(function(index) {
        var form = myForms.eq(index);
        var serializedForm = form.serialize();
        serializedForm += '&s_referer_fname='+$('#s_refererFname').val();
        $.post("http://post.aspx", serializedForm, function (data, status) {
            if (status === "success"){
                window.location.href= "http:url.aspx?";
            }  
        });   
    });
}
</script>

Answer 1

在FF和IE中，按钮而不是图像标记似乎捕获了onclick事件。

如果要跨越浏览器触发事件，请将其分配给按钮。这样它就可以从浏览器中的图像传播，从图像中提升它，而其他浏览器则立即在按钮上捕获它。

<button onclick="mySubmit();"> <img src="http://button_image.png" ></button>

可以在FF，IE和Chrome中使用►https://jsfiddle.net/aspqwc3p/1/

Answer 2

如果您希望图片成为提交按钮，则应使用input标记和type="image"属性：

 <input type="image" src="http://button_image.png" onclick="mySubmit();" />

请注意，在mySubmit功能中，您应该使用preventDefault()禁用默认行为：

function mySubmit() {
    this.preventDefault();

Answer 3

通常建议不要在HTML中添加任何JavaScript。尝试为您的按钮提供ID并使用

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

在你的javascript中。（并将您的脚本标记放在HTML的最后）

提交按钮在Chrome中工作，但不适用于Firefox或IE

3 个答案: