我正在开发网站,我需要用ajax更改页面。每个页面都有不同的javascript和css。当ajax内容加载时调用javascript我做错了。添加我在ajax内容加载时成功调用警告框但是在加载原始脚本时遇到问题。 这是我的代码的一些片段, index.html页面脚本
<script type="text/javascript">
function marmi(){
jQuery(document).ready(function(){
//resizeDiv();
});
window.onload = function(event) {
resizeDiv();
}
function resizeDiv() {
vph = jQuery(window).height();
mamu = (jQuery(window).height() - 277);
jQuery('#mam').css({'height': mamu + 'px'});
}
}
</script>
这是为了ajax 请注意我已经尝试过jQuery(“#about”)。on(“click”,function(){..}这个但是没有成功
<script>
jQuery.ajaxSetup ({
cache: false
});
jQuery("#about").click(function(){
marmi();
});
jQuery('#about').trigger('click');
jQuery("#architecture").click(function(){
function myFunction(){
jQuery.globalEval(alert("Hello\nContact"))
}
myFunction();
});
</script>
这里是主要的ajax脚本,其中url和ajax内容加载
jQuery(document).ready(function() {
var hash = window.location.hash.substr(1);
var href = jQuery('.aj_me').each(function() {
var href = jQuery(this).attr('href');
if (hash == href.substr(0, href.length - 5)) {
var toLoad = hash + '.html #ajax';
jQuery('#ajax').load(toLoad)
}
});
jQuery('a.aj_me').click(function() {
var toLoad = jQuery(this).attr('href') + ' #ajax';
jQuery('#ajax').hide('normal', loadContent);
window.location.hash = jQuery(this).attr('href').substr(0, jQuery(this).attr('href').length - 5);
function loadContent() {
jQuery('#ajax').load(toLoad, '', showNewContent())
}
function showNewContent() {
jQuery('#ajax').show('normal');
}
return false;
});
});
我在这个div中加载ajax内容
<div id="ajax">
</div>
所有单个页面在没有ajax的情况下正确加载。请有人帮忙找出问题
thankx 更新 修改过的ajax脚本
jQuery(document).ready(function() {
var hash = window.location.hash.substr(1);
var href = jQuery('.aj_me').each(function() {
var href = jQuery(this).attr('href');
console.log("href is:",href);
if (hash == href.substr(0, href.length - 5)) {
var toLoad = hash + '.html #ajax';
console.log("Going to load url:",toLoad);
jQuery('#ajax').load(toLoad)
}
});
jQuery('a.aj_me').click(function() {
var toLoad = jQuery(this).attr('href') + ' #ajax';
jQuery('#ajax').hide('normal', loadContent);
window.location.hash = jQuery(this).attr('href').substr(0, jQuery(this).attr('href').length - 5);
function loadContent() {
jQuery('#ajax').load(toLoad, '', showNewContent)
}
function showNewContent() {
jQuery('#ajax').show('normal');
marmi();
}
return false;
});
});
控制台输出
href is: index.html
href is: about.html
href is: contact.html
href is: index.html
href is: about.html
href is: contact.html
修改了index.html页面脚本
<script type="text/javascript">
function successCallback() {
function marmi(){
jQuery(document).ready(function(){
resizeDiv();
});
window.onload = function(event) {
resizeDiv();
}
function resizeDiv() {
vph = jQuery(window).height();
mamu = (jQuery(window).height() - 277);
jQuery('#mam').css({'height': mamu + 'px'});
}
}
}
function completeCallback() {
jQuery(document).ready(function(){
resizeDiv();
});
window.onload = function(event) {
resizeDiv();
}
function resizeDiv() {
vph = jQuery(window).height();
mamu = (jQuery(window).height() - 277);
jQuery('#mam').css({'height': mamu + 'px'});
}
alert('comleted');
}
function errorCallback() {
alert('error');
}
jQuery.ajax({
url:"index.html",
success:successCallback,
complete:completeCallback,
error:errorCallback
});
</script>
答案 0 :(得分:0)
我假设它位于代码的以下部分,是否可以添加建议的console.log并检查控制台是否有xhr活动?您可以将Firefox与firebug插件或Chrome一起使用。按F12查看控制台
jQuery(document).ready(function() {
var hash = window.location.hash.substr(1);
var href = jQuery('.aj_me').each(function() {
var href = jQuery(this).attr('href');
console.log("href is:",href);
if (hash == href.substr(0, href.length - 5)) {
var toLoad = hash + '.html #ajax';
console.log("Going to load url:",toLoad);
jQuery('#ajax').load(toLoad)
}
});
答案 1 :(得分:0)
如果你看一下jQuery的源代码(https://github.com/jquery/jquery/blob/master/src/ajax.js),你看看加载函数,你会看到当你指定一个从文档中提取的选择器时,它会使用<解析选择器的内容强> $。parseHTML()强>
self.html( selector ?
// If a selector was specified, locate the right elements in a dummy div
// Exclude scripts to avoid IE 'Permission Denied' errors
jQuery("<div>").append( jQuery.parseHTML( responseText ) ).find( selector ) :
$。parseHTML默认阻止脚本,但可以通过将“true”作为第二个参数传递给parseHTML函数来覆盖它。
长话短说...如果你想运行脚本,可以使用自己的自定义ajax函数来代替使用load。
var toLoad = '#ajax';
$.ajax({
url: yourURL,
dataType: 'html',
success: function (response) {
var content = $('<div>').append($.parseHTML(response), true).find(toLoad);
$('#ajax').html(content[0]);
}
});
答案 2 :(得分:-1)
我认为您需要查看JQuery AJAX文档。
http://api.jquery.com/jQuery.ajax/
如果您想要在AJAX调用成功完成后运行Javascript代码,请将该代码放在下面的成功部分中。
$.ajax({
type: "POST",
url: '/login/process',
data: formData,
success: function (data)
{
// Javascript to run
}
});