使用JQuery在Slider中选择NEXT单选按钮

时间:2011-09-20 04:17:09

标签: javascript jquery jquery-selectors

我用单选按钮滑块/ jcarousel构建一个图像,它应该做的是,当用户单击NEXT或PREVIOUS按钮时,它将加载下一个图像并选择该radiobutton。我得到了这个上一个按钮,但不是下一个,不知何故,它取代了NEXT值。

HTML:

<li>
    <div class="image-position"><img src="images.png" width="200" height="289"/></div>
    <input type="radio" class="getradiotomove" name="radio1" />Radio 1
</li>
<li>
    <div class="image-position"><img src="images.png" width="200" height="289"/></div>
    <input type="radio" class="getradiotomove" name="radio2" />Radio 2
</li>
 <li>
    <div class="image-position"><img src="images.png" width="200" height="289"/></div>
    <input type="radio" class="getradiotomove" name="radio2" />Radio 3
</li>

<div id="buttons">
    <a href="#" id="prev">prev</a>
    <a href="#" id="next">next</a>
    <div class="clear"></div>
</div>

JavaScript的:

jQuery('#prev').click(function() {
    jQuery(".getradiotomove").attr("checked", true);
    var left_indent = parseInt(jQuery('#slides ul').css('left')) + item_width;    
    jQuery('#slides ul:not(:animated)').animate({'left' : left_indent}, 200,function(){    
        jQuery('#slides li:first').before(jQuery('#slides li:last'));           
        jQuery('#slides ul').css({'left' : left_value});
    });        
    return false;

});


jQuery('#next').click(function() {
    //radio button value
    jQuery(".getradiotomove").attr("checked", true);
    var left_indent = parseInt(jQuery('#slides ul').css('left')) - item_width;
    jQuery('#slides ul:not(:animated)').animate({'left' : left_indent}, 200, function () {
        jQuery('#slides li:last').after(jQuery('#slides li:first'));                    
        jQuery('#slides ul').css({'left' : left_value});
    });
    return false;

});

0 个答案:

没有答案