无法在ajax中加载javascript

时间:2013-05-04 03:12:09

标签: javascript ajax jquery dom

我正在开发网站,我需要用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>

3 个答案:

答案 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
    }
});