jqmodal窗口关闭除FF之外的所有浏览器的表单提交

I have a comment window that opens up in a small jqmodal window. I am trying to use $.ajax to submit the form and show "success" in the small modal window. but in all browsers except firefox, the modal closes when I submit the form.

我有一个注释窗口，可以在一个小的jqmodal窗口中打开。我正在尝试使用$ .ajax提交表单并在小模态窗口中显示“成功”。但是在除firefox之外的所有浏览器中，当我提交表单时，模态会关闭。

<script type="text/javascript">
$().ready(function() {

$('.reportForm').submit( function(){
    if (document.rForm.comment.value != "") {
        $('.reportForm').hide();

        $.ajax({
            type: "POST",
            url: "<?php echo $_SERVER["PHP_SELF"]; ?>?c=<?php echo $c; ?>",
            cache: false,
            data: "comment=" + document.rForm.comment.value,
            success: function(html){
                        $("#results").append(<?php echo get_option('ddrc_success'); ?> + " ");
                     }

        });
        return false;           
    } 

});
});

1 个解决方案

#1

I'm not 100% sure but the problem could be in this line:

我不是百分百肯定，但问题可能出在这一行：

if (document.rForm.comment.value != "") {

I don't think this code is cross-browser. Assuming rForm in the .reportForm you can replace it with

我不认为这段代码是跨浏览器的。假设.reportForm中的rForm可以替换它

if ($(this).find("[name='comment']").val()) {

$(this) in this context will reference $('.reportForm'), because you are binding to reportForm's submit event. find("[name='comment']") will locate a child element with attribute name is comment. val() returns the value of the element.

$（this）在此上下文中将引用$（'。reportForm'），因为您绑定到reportForm的提交事件。 find（“[name ='comment']”）将找到属性名称为comment的子元素。 val（）返回元素的值。

Also, the way you wrote this method if there is no value in the comment field the form will get submitted the normal way.

此外，如果注释字段中没有值，您编写此方法的方式将以正常方式提交表单。

You should consider moving

你应该考虑搬家

return false;

to be the last line in your method.

成为你方法的最后一行。

The whole example reworked:

整个例子重新修改：

<script type="text/javascript">
    $(function() {
        $('.reportForm').submit(function() {
            if ($(this).find("[name='comment']").val()) {
                $(this).hide();

                $.ajax({
                    type: "POST",
                    url: "<?php echo $_SERVER["PHP_SELF"]; ?>?c=<?php echo $c; ?>",
                    cache: false,
                    data: "comment=" + $(this).find("[name='comment']").val(),
                    success: function(html) {
                        $("#results").append(<?php echo get_option('ddrc_success'); ?> + " ");
                    }

                });
            } else {
                alert("Please, fill the comment field");
            }
            return false;                   
        });
    });
</script>

#1