我的javascript代码结果闪烁

Question

当我点击孟加拉语按钮时，它显示数据几秒钟并再次隐藏它，而我为阿萨姆语按钮编写了相同的代码，它显示正常：

<script>
    function be(){
      var x= document.getElementById('ben');
      if (x.style.display==='block'){
        x.style.display='none';
      }
      else
      {
        x.style.display='block';
      }
    }
</script>
<button class= "button" onclick="be()">BENGALI</button>
<div id="ben">
<?php
$dir = '/home/test/data/Bengali/';
if (!isset($_POST['submit'])) {
if ($dp = opendir($dir)) {
    $files = array();
    while (($file = readdir($dp)) !== false) {
        if (!is_dir($dir . $file)) {
            $files[] = $file;
        }
    }
    closedir($dp);
}

if ($files) {
    echo '<form action="' . $_SERVER['PHP_SELF'] . '" method="post">';
    foreach ($files as $file) {
        echo '<input type="checkbox" name="files[]" value="' . $file . '" /> ' 
 .
             $file . '<br />';

  }
}
}
?></div>

Answer 1

单击提交按钮时调用该函数。

所以JS运行，然后表单提交，然后你加载一个新的页面。

新页面未将默认样式设置为之前的样式，因此它具有重置页面的效果。

Answer 2

如前所述，由于点击了一个按钮，因此打开了一个新页面。解决此问题的最佳方法是修改按钮，如下所示：

<button class= "button" onclick="be()" type="button">BENGALI</button>

这可以防止表单提交并运行您的JavaScript函数