在Firefox中可以正常工作，但在chrome中不能正常工作

Question

這是我的代碼..

<!DOCTYPE html>
<html>
  <head>    
    <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
  </head>
  <body>

   <form id="foo">
    <label for="bar">A bar</label>
    <input id="bar" name="bar" type="text" value="" />
    <input type="submit" value="Send" />
   </form>

   <div id ="onsuccess"></div>
 </body>

</html>
Javsacript:

<script>
// variable to hold request
var request;
// bind to the submit event of our form
$("#foo").submit(function(event){

  $("#onsuccess").html('<img src="a.gif"/>');
    var $form = $(this);

    var serializedData = $form.serialize();

    request = $.ajax({
        url: "a.txt",
        type: "post",
        timeout:30000,  
        dataType: "text", 
        data: serializedData,

    });

    // callback handler that will be called on success
    request.done(function (response, textStatus, jqXHR){
        // log a message to the console
        console.log("Hooray, it worked!");
        $("#onsuccess").html(response);

    });

    // callback handler that will be called on failure
    request.fail(function (jqXHR, textStatus, errorThrown){
        // log the error to the console
        console.error(
            "The following error occured: " +
            textStatus, errorThrown         
        );
    });

    // callback handler that will be called regardless
    // if the request failed or succeeded
    request.always(function () {
        // reenable the inputs
       // $inputs.prop("disabled", false);
    });

    // prevent default posting of form
    event.preventDefault();


});
/*
$("#loading").ajaxStart(function(){
    $(this).show();
 }).ajaxStop(function(){
    $(this).hide();
 });
*/

$(document).ready(function(){

$(window).scroll(function(){

/*console.log("you are scrolling the page");
console.log("window scroll top ="+ $(window).scrollTop() );
console.log ("window height =" + $(window).height());
console.log("document height =" + $(document).height());
*/

if ($(window).scrollTop() == $(document).height()-$(window).height())
        {
$("#onsuccess").append("<p>i was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page end i was called because you are about to reach the page end</p>");
    }

});    
});
</script>

在這里，我試圖通過隨機文本動態追加頁面。...只是研究Ajax的功能。.i在mozilla上進行了檢查，它確實起作用了...但是在chrome上卻沒有。 任何想法..謝謝

在chrome中，我可以看到微調器，txt文件的內容未加載...而在Firefox中..txt文件的內容已加載，滾動功能也有效...（（沒有滾動的問題chrome中的內容，因為文檔為空，我無法向下滾動））請告訴我，我還應該給您提供什么輸入。.firebug中沒有錯誤–

Answer 1

嘗試將您的提交處理程序$("#foo").submit(function(event){...});放入$("#foo").submit(function(event){...}); 在您的document.ready()處理函數內部。

像這樣

$(document).ready(function () {

    $("#foo").submit(function (event) {

        $("#onsuccess").html('<img src="a.gif"/>');
        var $form = $(this);

        var serializedData = $form.serialize();

        request = $.ajax({
            url: "a.txt",
            type: "post",
            timeout: 30000,
            dataType: "text",
            data: serializedData,

        });

        // callback handler that will be called on success
        request.done(function (response, textStatus, jqXHR) {
            // log a message to the console
            console.log("Hooray, it worked!");
            $("#onsuccess").html(response);

        });

        // callback handler that will be called on failure
        request.fail(function (jqXHR, textStatus, errorThrown) {
            // log the error to the console
            console.error(
                "The following error occured: " + textStatus, errorThrown);
        });

        // callback handler that will be called regardless
        // if the request failed or succeeded
        request.always(function () {
            // reenable the inputs
            // $inputs.prop("disabled", false);
        });

        // prevent default posting of form
        event.preventDefault();


    });

    $(window).scroll(function () {

        /*console.log("you are scrolling the page");
console.log("window scroll top ="+ $(window).scrollTop() );
console.log ("window height =" + $(window).height());
console.log("document height =" + $(document).height());
*/
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            $("#onsuccess").append("<p>i was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page endi was called because you are about to reach the page end i was called because you are about to reach the page end</p>");
        }

    });
});

在Firefox中可以正常工作，但在chrome中不能正常工作

問題描述

1 個解決方案

解決方案1
0 2013-09-11 13:58:25

在Firefox中可以正常工作，但在chrome中不能正常工作

問題描述

1 個解決方案

解決方案1 0 2013-09-11 13:58:25

解決方案1
0 2013-09-11 13:58:25