Php 为什么jquery对话框消息会不自觉地刷新我的页面（表单内部）

我试图将一个简单的jquery对话框消息嵌入到表单中。该对话框应该只显示一些附加信息，并且不以任何方式与表单交互，除非通过表单内部的按钮调用

我的问题是：如果从表单内部调用对话框，整个页面会立即刷新，根本不显示对话框并清除所有表单字段。如果按钮在窗体外部，则一切正常

对话框内容通过以下模板加载：

<script>
$(function() {
    var dlg = $( "#dialog-message" ).dialog({
        autoOpen: false,
        width: '80%',
        closeOnEscape: false,
        modal: true,
        buttons: {
            Ok: function() {
                $( this ).dialog( "close" );
            }
        },
        open: function() {
            // Content laden...
            $("#dialog-message").load('template.html', function() {}).dialog()
        }
    });
    $( "#opener" ).click(function() {
        $( "#dialog-message" ).dialog( "open" );
    });
});
</script>

$（函数（）{
var dlg=$（“#对话框消息”）.dialog({
自动打开：错误，
宽度：“80%”，
closeOnEscape：错误，
莫代尔：是的，
按钮：{
好的：函数（）{
$（此）.dialog（“关闭”）；
}
},
打开：函数（）{
//内容丰富。。。
$（“#对话框消息”）.load（'template.html'，function（）{}）.dialog（）
}
});
$（“#开场白”）。单击（函数（）{
$（“#对话框消息”）。对话框（“打开”）；
});
});

表单集成：

<form method="post" name="post" action="index.php?site=bewerbung">
  <table width="100%" border="0" cellspacing="1" cellpadding="2" bgcolor="$border">

  ...

  </tr>
    <tr bgcolor="$bg1">
    <td height="25">&nbsp;</td>
    <td><input class="input" type="checkbox" name="rules" id="rules" value="1" /><button id="opener">Regeln</button></td>
  </tr>

</table>
</form>

...
雷格尔恩

您的按钮提交表单，因此您需要防止通过JavaScript执行默认按钮操作：

$("#opener").on('click', function(e) {
    dlg.dialog("open");
    e.preventDefault();
});

您没有提到您正在使用的jQuery（UI）版本。我上面的代码是针对较新版本的。

---

以下是按钮和提交输入的一般说明。

：如果在函数末尾添加“return false；”，可以防止刷新页面。就你而言

$( "#opener" ).click(function() {
    $( "#dialog-message" ).dialog( "open" );
    return false;
});

按钮默认操作。使用$（“#opener”）。单击（函数（事件）{event.preventDefault（）；$（“#对话框消息”）。对话框（“打开”）；}）；