Question

我有一个jTable，我想每隔X秒刷新一次。以前我有正确的运行并进行了一些小的编辑，现在它没有正常运行，我无法确定我做了什么会导致这一点。

以下是我的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>

然后在我的身体内有两个按钮定义如下：

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

以下，我有这一行

<div id="TableContainer"/>

现在当按下任一按钮时它将执行一次该功能，但之后它不会继续重新加载该表。

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

是什么导致这种情况发生？或者我该如何调试这样的东西？正如我之前说过的，这是以前正确运行的

Answer 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，你真的不应该传入一个字符串，因为每次调用它都必须进行评估，传入一个名为或匿名的函数。

Answer 2

您的代码格式错误。

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

应该阅读

 window.setInterval(function(){$('#TableContainer').jtable('reload');},5000)

什么阻止我的setInterval函数正确执行？

2 个答案: