从ajax函数获取新内容并在单击时替换它

时间:2014-06-12 19:33:55

标签: javascript jquery html ajax

我有一个带有div的页面,当用户点击一个单选按钮时会获得新的内容,当页面加载时它会显示主要内容,当用户点击X单选按钮时,该内容会获得"复新"或者"不同的"信息,有一个DIV ID不会改变......所以...
当用户加载页面时,我检查了一些值,X值是否低于然后替换div内容,在第一次加载时它工作正常,但如果用户更改选项,则第一个脚本不会做任何事情......所以这里是基本的html

    <div id="options">
    <input type="radio" onclick="javascript:checkOut(this.name,'shipr');" value="1" name="shipping" id="s1">
    <input type="radio" onclick="javascript:checkOut(this.name,'shipr');" value="2" name="shipping" id="s2">

<input type="text" id="qty" class="hidden" value="1.2" style="display: none;">

    </div>

    <div id="information">

    <div id="prices>$120.00</div>
    <div id="products">Multiple[...] and tabs long list</div>
    <div id="checkoutbtn">Buy Now</div>

    </div>

基本上当用户点击任何一个单选按钮时,div的内容就是#34;信息&#34;取而代之的是ajax信息,我想知道如何获取新内容和&#34;替换&#34;一些价值......
现在,具有隐藏的ID数量的输入具有我需要的值是该值小于或大于我使用来自&#34的id checkoutbtn替换div内的按钮;立即购买&#34;到#34;只在美国和英国境内,请索取报价&#34; ...所以,我的JS是:

(function($) {

        var pkg = $("#qty").val();
        var cot = '<a rel="{handler: \'iframe\', size: {x: 570, y: 550}}" ' +
            'class="modal" href="qut.php">' +
        '<input type="button" value="Quotation" class="btn btn-small">' +
        '</a>';
        window.onload = function() {

            if (pkg < 4 ) {
                // do something
                // alert('Checked');
                $('#checkoutbtn').html(cot);
            }
        };

        $('input:radio[name="shipping"]').change(
            function(){

                if ($(this).is(':checked') && $(this).attr("id") == 's1') {

                    // alert(pkg);
                    $('#checkoutbtn').html(cot);
                } else if ($(this).is(':checked') && $(this).attr("id") == 's2') {

                    $('#checkoutbtn').html(cot);
                }
            });

    })(jQuery);

第一次加载页面时,它工作正常,如果ajax没有用id信息更改div的内容,它将是完美的,但不是......
你可以看到我有这段代码:$(&#39;输入:radio [name =&#34; shipping&#34;]&#39;)。change()...所以现在我需要一些东西会花些时间加载新内容或检查新内容何时准备就绪,然后执行其他代码$(&#39;#checkoutbtn&#39;)。html(cot); ...问题是,我该怎么做...如果我把2秒的超时时间它可能有效,但有时需要3或5秒才能使新信息准备好并可供用户使用是一个问题......

因此,我需要在用户点击单选按钮后检查新内容何时准备好,我该怎么做?

谢谢。

0 个答案:

没有答案