jQuery +循环在jsfiddle中不起作用

时间:2012-11-08 10:49:51

标签: jquery jquery-ui jquery-selectors jquery-ui-sortable

我有以下脚本,我似乎无法在jsfiddle中工作:

我不明白为什么这不起作用?

var $widget = $("<div class='widget widget_" + i + "'>").appendTo( $(".column_" + j );
$("<div class='widget_header widget_header_" + i + "'>").appendTo( $widget );
$("<div class='widget_sub_header widget_sub_header_" + i + "'>").appendTo( $widget );
$("<div class='widget_content widget_content_" + i + "'>").appendTo( $widget );
$("<div class='widget_footer widget_footer_" + i + "'>").appendTo( $widget );

3 个答案:

答案 0 :(得分:5)

您的脚本出错了。您忘记了以下行中的结束括号:

var $widget =                   // --------------------------------------v
    $("<div class='widget widget_" + i + "'>").appendTo( $(".column_" + j) );

DEMO: http://jsfiddle.net/wq6Cc/18/

答案 1 :(得分:1)

你必须改变这个

var $widget = $("<div class='widget widget_" + i + "'>").appendTo( $(".column_" + j );

  var $widget = $("<div class='widget widget_" + i + "'>").appendTo( $(".column_" + j ) );

它会完美运作。

答案 2 :(得分:0)

与您的问题无关,通过一些修改,您的代码可以更清晰。

$('#divMain').empty()
    .append( $('<div>').addClass('column column_1') )
    .append( $('<div>').addClass('column column_2') )
    .append( $('<div>').addClass('column column_3') );

$('.column').sortable({
    tolerance   : 'pointer',
    connectWith : '.column'
});

for (var j = 1, i; j <= 3; j++) {
    for (i = 0; i <= 2; i++) {
        $('<div>').addClass('widget widget_' + i)
            .append( $('<div>').addClass('widget_header widget_header_' + i) )
            .append( $('<div>').addClass('widget_sub_header widget_sub_header_' + i) )
            .append( $('<div>').addClass('widget_content widget_content_' + i) )
            .append( $('<div>').addClass('widget_footer widget_footer_' + i) )
            .appendTo('.column_' + j);
    }
}