2

我让 jQuery 遍历所有带有类按钮的提交按钮，并将它们每个都变成带有类按钮的锚元素。

$("input.button").each(function(i) {

    var anchorButton = $("<a class='"+this.className+"' href='#'>"+this.value+"</a>")



    anchorButton.click(function(eventObject) {

        $(this).blur().prev("input.hidden").click();

        return false;

    });



    $(this)

        .after(anchorButton)

        .addClass("hidden")

        .removeClass("button pill-left pill-center pill-right");

});

然后，我可以使用 CSS 跨浏览器设置锚元素的样式。只有一个问题。每当我在表单输入元素上按 Enter 键时，表单都不会提交。但是，如果我取消隐藏提交按钮，它会再次起作用。总之，除非我有一个可见的提交按钮（显示！= 无），否则我无法获得 Enter/Return 键来提交表单。

当我隐藏提交按钮时按 Enter 时如何让表单提交？

4

4 回答 4

3 
$("input.button").keydown(function(event) {
   if(event.keyCode == 13)
      $("...find the form...").submit();
});

这应该有效。

如果它不尝试这个：

   $("..find the input button you hide..").css('position', 'absolute')
         .css('top', '-1000px');

这比建议的visibility: hidden解决方案要好，因为如果您将可见性设置为隐藏，该按钮仍将“占用空间”。

于 2010-08-22T19:39:01.113 回答
1

只需在您的 HTML 中使用普通form的，包括提交action属性。然后，您将获得浏览器的默认行为，并Enter在表单中按下将提交它。然后，您不必使用 jQuery 将事件处理程序绑定到所有提交按钮。

您可以使用此JSBin对其进行测试。

于 2010-08-22T19:39:03.420 回答
-1

您是否尝试过将可见性更改为隐藏而不是显示为无？

于 2010-08-22T19:35:42.560 回答
-1

尝试可见性=隐藏

于 2010-08-22T19:37:19.390 回答