Ajax不会在Internet Explorer中执行PHP Form并重新加载整个索引页

时间:2014-08-05 09:29:44

标签: php jquery ajax internet-explorer

我目前正在ISP实习,而且我正在编程,但这对我来说还是一个新手。

我总是使用Chrome进行调试和测试,但ISP的官方浏览器是Internet Explorer,因此我的代码必须在IE中使用。

现在:昨天晚上,当ajax请求通过PHP将文本形式的值发送到mysql数据库时,我感到非常高兴。但是今天,回到工作岗位,我发现它在IE中根本不起作用。

点击submit后,重新加载整个索引页面,并且根本没有将值保存到数据库中。

代码如下(前两个ajax请求工作很大,它是最后一个没有工作的textarea-ajax-request):

$("#display7").click(function() {                
    $.ajax({  
        type: "GET",
        url: "cabcab2.php",          
        dataType: "html",                  
        success: function(response){ 
            $("#responsecontainer").show().html(response);  
            $(".name").on("click", function() {
                var category_id = {};
                category_id['id'] = $(this).attr("id");
                $.ajax({
                    type: "POST",
                    url: 'display2.php',
                    data: category_id,
                    success: function( response2 ) {
                        $("#details").toggle().html( response2 );
                    }
                });
            })

            //function to insert textarea**
            function insertTextarea() {
                var boardInfo = $( "<form id='boardComment'><textarea rows='4' cols='50'></textarea><input type='submit' value='Submit'><input type='reset' value='Cancel'></form>");   
                $( this ).html(boardInfo);
                $(".boardinfo").off();
                console.log("boardinfo click event off");
                $("#boardComment").on( "submit", function( event ) {
                    console.log( "Handler for submit called." );
                    event.preventDefault(); 
                    var change_id = {};
                    console.log($(this).parent().attr("id"));
                    console.log( $(this).find("textarea").val());
                    change_id['id'] = $(this).parent().attr("id");
                    change_id['comment'] = $(this).find("textarea").val();
                    console.log($(this).parent());
                    $.ajax({
                        type: "POST",
                        url: "boardinfo2.php",
                        data: change_id,
                        success: function( response2 ) {
                            alert("Your comment has been saved!");
                            $("#" + change_id['id']).html("<img src='http://'>");
                            $( ".boardinfo" ).on( "click", insertTextarea );
                        }
                    });         
                });
                $("#boardComment").on( "reset", function( ) {
                    $( this ).html("<img src='http://'>");
                    $( ".boardinfo" ).on( "click", insertTextarea );
                });
            }   
            $( ".boardinfo" ).on( "click", insertTextarea );
        }
    }); 
});

textarea在IE中加载,但是当我点击提交时,WHOLE页面( - &gt; index.html)会重新加载,并且值不会保存到数据库中。

这个问题有解决办法吗?我非常喜欢它在Chrome和Firefox中的外观和感觉,所以我不想放弃代码。

如果有人知道某事,会很高兴!

1 个答案:

答案 0 :(得分:1)

你试过preventing default behaviour吗? IE很可能只是提交表单,从而重新加载页面。你需要防止它发生。

$("#display7").click(function(event) { 
    // tell browser to stop executing any default behaviour for this event
    event.preventDefault();
});