2013-08-07 2 views
4

ниже - мой код.для петли внутри приложения не работает

$("<table/>",{"cellspacing":"0","cellpadding":"0","border":"0","width":"100%"}) 
.append(
$("<tbody/>") 
.append(function(){ 

    options=["ONE","TWO","THREE","FOUR"]; 
    $.each(options, function(val) { 
     return ($("<tr/>") 
     .append(
      $("<td/>").html("4/6/2013 10:41"), 
      $("<td/>").html("5/6/2013 10:42"), 
      $("<td/>").html(val), 
      $("<td/>").html("<img src='pdf_16x16.png'/>"), 
      $("<td/>").html("<a href='#'>Re-Upload Documents</a>") 
     )); 
    }) 

}) 
).appendTo("body"); 

для цикла внутри приложения не работает.

+0

val здесь индекс. Это то, чего вы ожидаете? '$ .each (options, function (i, val) {...});'? –

+0

Как вы выглядите html? – acudars

+0

Typo: у вас есть две закрывающие скобки после 'append', вам нужны фигурные скобки и скобка:'}); ' –

ответ

5

Проблема в том, что вы ничего не возвращаются из функции append, только each петля внутри него. Попробуйте это:

$("<tbody/>").append(function(){ 
    options = ["ONE","TWO","THREE","FOUR"]; 
    var $container = $('<table></table>'); 

    $.each(options, function(val) { 
     $container.append($("<tr/>").append(
      $("<td/>").html("4/6/2013 10:41"), 
      $("<td/>").html("5/6/2013 10:42"), 
      $("<td/>").html(val), 
      $("<td/>").html("<img src='pdf_16x16.png'/>"), 
      $("<td/>").html("<a href='#'>Re-Upload Documents</a>") 
     )); 
    }); 

    return $container.html(); 
}); 

Example fiddle

+0

Спасибо. это работает. но он должен быть tr не div в переменной контейнера. Великий!. – Natesan

+1

@Natesan Почему? Он возвращает содержимое, а не элемент. Возможно, он мог бы использовать ТАБЛИЦУ, но не TR –

0

Попробуйте как

$.each(options, function(val) { 
    return ($("<tr/>") 
    .append(
     $("<td/>").html("4/6/2013 10:41") + 
     $("<td/>").html("5/6/2013 10:42") + 
     $("<td/>").html(val) + 
     $("<td/>").html("<img src='pdf_16x16.png'/>") + 
     $("<td/>").html("<a href='#'>Re-Upload Documents</a>") 
    )); 
}) 
+0

Извините, это не работает ... – Natesan

+0

Попробуйте с моим редактированием – Gautam3164

+1

@Natesan, что значит не работать, что вы ожидаете??? –

1

Попробуйте

var tbody = $("<tbody/>").appendTo($("<table/>", { 
    "cellspacing" : "0", 
    "cellpadding" : "0", 
    "border" : "0", 
    "width" : "100%" 
}).appendTo("body")); 

options = ["ONE", "TWO", "THREE", "FOUR"]; 
$.each(options, function(key, val) { 
    return tbody 
    .append($("<tr/>") 
      .append($("<td/>").html("4/6/2013 10:41")) 
      .append($("<td/>").html("5/6/2013 10:42")) 
      .append($("<td/>").html(val)) 
      .append($("<td/>").html("<img src='pdf_16x16.png'/>")) 
      .append($("<td/>").html("<a href='#'>Re-Upload Documents</a>"))); 
}) 

Демо: Fiddle

+0

более читаемый ИМО –

0

попробовать следующее:

$("<table/>",{"cellspacing":"0","cellpadding":"0","border":"0","width":"100%"}) 
.append("<tbody></tbody>").appendTo("body"); 

$("tbody").append(function(){ 
    options = ["ONE","TWO","THREE","FOUR"]; 
    var $container = $('<div></div>'); 

$.each(options, function(val) { 
    $container.append($("<tr/>").append(
     $("<td/>").html("4/6/2013 10:41"), 
     $("<td/>").html("5/6/2013 10:42"), 
     $("<td/>").html(val), 
     $("<td/>").html("<img src='pdf_16x16.png'/>"), 
     $("<td/>").html("<a href='#'>Re-Upload Documents</a>") 
    )); 
}); 

    return $container.html(); 
}); 

рабочую скрипку здесь: http://jsfiddle.net/mCLsm/2/

Смежные вопросы