代码之家  ›  专栏  ›  技术社区  ›  restlessdesign

阻止默认表单行为时获取自动完成/建议的输入

  •  0
  • restlessdesign  · 技术社区  · 15 年前

    有趣的bug似乎只限于IE和WebKit。 我有一个基本的表单设置:

    <div id="output">Form output is displayed here</div>
    
    <form id="myForm" action="#" method="post">
    <input type="text" name="username" id="usernameInput" />
    <input type="submit" value="Submit" />
    </form>
    

    现在,如果我只是通过普通的页面刷新提交表单,下次我在输入字段中输入文本时,我将得到浏览器的默认自动建议下拉列表(这是预期的行为)。但是,如果为了执行Ajax提交而突出显示表单提交行为:

    $('#myForm').submit(function () {
        $('#output').text($('usernameInput').val());
        return false;
    });
    

    现在,当我提交表单时,输出DIV会更新,但是我输入到表单中的先前值不会被存储,并且在您键入时不会给出任何建议。

    有没有人对这个问题有创造性的解决办法?也许一个( 吞咽 iFrAME?

    2 回复  |  直到 15 年前
        1
  •  1
  •   geowa4    15 年前

    IE和WebKit只记住正常提交的值,由于您是通过Ajax提交的,所以这些引擎不记住这些值。我不使用iframe,而是使用jquery插件进行自动完成,比如 this one . 当然,有了这个解决方案,您将需要维护一个用户过去键入的内容列表,这不应该太难。

        2
  •  0
  •   andres descalzo    15 年前

    在控制提交时进行这些修改测试:

    $('#myForm').submit(function (e) {
        e.stopPropagation();
        $('#output').html($("#usernameInput").val() + "<br />");
    });