Question

我目前有一个按钮，当点击它时，它将按钮id传递给一个函数，该函数会提醒这个id名称。现在，警报显示正确的名称，但是当我在警报上单击“确定”时，它会将我带回主页。这是代码：

JS：

function ButtonPicture(id)
{
    alert(id);
}

HTML：

<input type="submit" onclick="ButtonPicture(this.id);" id="car1" value="Take Picture">

我不确定为什么会这样，以及如何防止这种情况

Answer 1

您已将函数附加到提交输入元素。默认情况下，当您单击提交按钮时，浏览器将提交附加到其上的表单，该表单将页面重定向到表单指定的操作。如果未指定任何操作，则会重定向到当前页面。

您需要在此处阻止默认操作。您有很多选择，但我在下面提供了两个常见选项：

选项1：不引人注意地绑定click事件，并阻止默认：

<强> JQuery的

$(document).ready(function() {
    $("#car1").click(function(e) {
        e.preventDefault();
        ButtonPicture(this.id);
    });
});

注意：如果将此代码放在文档中的输入元素之后，则无需将其包装在$(document).ready(function() { });中。

<强> HTML

<input type="submit" id="car1" value="Take Picture">

选项2：返回false

您可以从onclick事件返回false：

<input type="submit" onclick="ButtonPicture(this.id); return false;" id="car1" value="Take Picture">

我的个人偏好和建议是选项1