0

X 秒ごとに更新したいjTableがあります。以前はこれを正しく実行していて、いくつかの小さな編集を行っていましたが、今では正しく機能せず、何が原因であるかを判断できません。

これが私のjTableと開始/停止関数のコードです:

<script type="text/javascript">
            var run=null;
            $(document).ready(function() {
                $('#TableContainer').jtable({
                    title: '',
                    actions: {
                        listAction: 'JSONCreator',
                    },
                    ajaxSettings: {
                        type: 'POST',
                        dataType: 'json'
                    },
                    fields: {
                        DeviceId: {
                            key: true,
                            list: false
                        },
                        DeviceTag: {
                            sorting: false,
                            search: true,
                            title: 'D',
                            width: '40%'
                        },
                        CH1: {
                            title: 'C1',
                            width: '10%'
                        },
                        CH2: {
                            title: 'C2',
                            width: '10%'
                        },
                        Timestamp: {
                            title: 'T',
                            width: '30%',
                            create: false,
                            edit: false
                        }
                    },
                });
                $('#TableContainer').jtable('load');
            });
            function startFunction() {
                document.title = '(Running)';
                run = window.setInterval("$('#TableContainer').jtable('reload')", 5000);
                window.open('M');
            }
            function stopFunction() {
                document.title = 'W';
                window.clearInterval(run);
                window.open('M');
            }
        </script>

次に、ボディ内に 2 つのボタンを次のように定義した後:

<input type="submit" value="Start" onclick="startFunction()"/>
<input type="submit" value="Stop" onclick="stopFunction()"/>

この下にこの行があります

<div id="TableContainer"/>

いずれかのボタンを押すと機能が1回実行されますが、その後はテーブルのリロードを続けません。

window.setInterval("$('#TableContainer').jtable('reload')", 5000);

これが起こる原因は何ですか？または、どうすればこのようなものをデバッグできますか? 前に言ったように、これは以前は正しく実行されていました

4

2 に答える 2

1

送信アクションをキャンセルしていません。

<input type="submit" value="Start" onclick="startFunction()"/>
<input type="submit" value="Stop" onclick="stopFunction()"/>

false を返すか、 preventDefault を呼び出す必要があります

<input type="submit" value="Start" onclick="startFunction(); return false;"/>
<input type="submit" value="Stop" onclick="stopFunction(); return false;"/>

インライン イベントを使用するべきではありません。jQuery を使用している場合は、それを利用してください。

$(window).on("click", "input[type=submit]", function(e) {
    e.preventDefault();
    if (this.value==="Start") {
        startFunction();
    } else {
        stopFunction();
    }
});

また、setTimeout については、呼び出されるたびに評価する必要があるため、文字列を渡す必要はありません。名前付きまたは匿名の関数を渡します。

于 2013-07-16T17:27:01.983 に答える