3

我有一个表单，因为它是异步提交的

<input id="idField" type="text" placeholder="Enter id" />
<input type="button" value="submit ID"  id="submitBtn" />

$(document).ready(function () {
    $("body").on("click", "#submitBtn", function () {
        var id = $("idField").val();
        $.ajax({
            type: "post",
            url: "post.php",
            data: {
                "id": id
            },
            success: function () {
                alert("done");
            }
        });
    });
});

因此，谷歌似乎（https://stackoverflow.com/a/11746358/1252748）拒绝自动填充我过去输入的数据。解决这个问题的最好方法是什么？

像这样的东西？

<form method="post"> 
<input id="idField" type="text" placeholder="Enter id" />
<input type="button" id="submit" class="fr gen-btn" value="Submit" onClick="postForm()" /> 
</form>

function postForm() {
    var id = $("idField").val();
    $.ajax({
        type: "post",
        url: "post.php",
        data: {
            "id": id
        },
        success: function () {
            alert("done");
        }
    });
}
4

1 回答 1

2

在发现自己处于非常相似的情况之后，这是我建议的解决方案。

  1. 使用 FORM 标签来包装您的输入
  2. 确保提交表单以确保浏览器存储下次输入字段值（以使用“自动填充”功能显示它们）

请参阅下面的 HTML 代码：

<form id="myForm" method="post" action="about:blank" target="_sink">
    <input id="idField" type="text" placeholder="Enter id" />
    <input id="submitBtn" type="button" value="submit ID" />
</form>
<iframe src="about:blank" name="_sink" style="display:none"></iframe>

<script type="text/javascript">
    // assuming jQuery is available
    $(document).ready(function () {
      $("#myForm").submit(function () {
        var id = $("#idField").val();
        $.ajax({
          type: "post",
          url: "//localhost/dummy/post.php",
          data: {
            "id": id
          },
          success: function () {
            alert("done");
          },
          error: function () {
            alert("Error"); // we expect an error here since we're not actually posting to a real server
          }
        });
      });
    });
</script>

当您在 idField 中输入值并按 Enter（或单击提交按钮）时，它会尝试使用 ajax 发布请求将表单数据提交到远程服务器。同时，它还将表单提交到隐藏的 iframe，这使得 Chrome 能够存储值以重新用于自动填充。

我还做了一个 jsFiddle 演示：http: //jsfiddle.net/C5Qgf/

于 2014-03-05T07:12:50.963 回答