这是我的代码..
<!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>
在这里，我试图通过随机文本动态追加页面....只是研究在Mozilla上检查的Ajax..i的功能，它工作...但不是在chrome上。任何想法......谢谢
在chrome中，我可以看到微调器，txt文件的内容没有加载...而在firefox中... txt文件的内容加载和滚动功能也有效......（（没有在Chrome中滚动事物的问题，因为文档是空的，我无法向下滚动））请告诉我应该给你什么更多的输入..在firebug中没有错误 -
答案 0 :(得分：0)
尝试将提交处理程序$("#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>");
}
});
});