1

更新: abdu の答えは機能しましたが、スクリプトを index.html ファイルに埋め込んだ場合にのみ (リンクされた app.js ファイルにスクリプトを含めるのではなく)...

jquery mobile と angularjs (一緒ではない) でいくつかの単純なモバイルアプリを作成して、どちらを構築したいかを確認しています...

jquery モバイルで問題が発生しています。フォームを送信すると、単にリストを動的に更新する代わりに、ページが更新されてクリアされます。

<div id="home" data-role="page">

<div data-role="content">
    <form id="form1"> 
        <input id="list-text" type="text" placeholder="enter text here...">
        <button id="button1" onclick="addToList()" >Add</button>
    </form>

    <ul id="the-list" data-role="listview"></ul>
</div>


function addToList() {
    var newText = $('#list-text').val();
    $('#the-list').append('<li>' + newText + '</li>');
    // will be updating localStorage here

    $('#list-text').val(' ');

}

私はこれを調査しようとしましたが、まだ理由がわかりません....フォームとjqueryについてもっと理解する必要があるかもしれません。

4

3 に答える 3

2

ボタンをフォームの外に移動するか、フォームの送信を停止することができます。例

$("#form1").on('submit',function(){return false;});

これにより、更新が停止します。

また、クリック イベントの処理には、onclick ではなく jquery を使用することをお勧めします。例

$("#button1").on('vclick',function(){});

モバイル デバイスでクリック ハンドラーを使用すると、クリックが 200 ミリ秒遅れますが、これはかなり長いため、vclick を使用してください。vclick については、こちらを参照してください。

于 2013-07-04T02:09:10.357 に答える
2

この属性を追加します:

data-ajax="false"

あなたのフォームに。jQuery Mobile がフォーム処理をハイジャックするのを防ぎます。

また、jQuery Mobile でフォームを処理する方法に関する他の回答もお読みください: https://stackoverflow.com/a/15205612/1848600

公式ドキュメントへのリンク: http://jquerymobile.com/demos/1.2.0/docs/forms/forms-sample.html

于 2013-07-03T22:01:06.230 に答える
1

event.preventDefault(); を試してください。

false を返す代わりに;

于 2014-02-04T18:35:34.383 に答える