1

わかりましたので、これが基本的なマークアップです

<ul>
    <li>User 1</li>
    <li>User 2</li>
    <li>User 3</li>
</ul>
<form>
    <input type="text" value="" name="username[]" id="users"/>
</form>

私がやりたいのは、ulの長さを取得することです。これは私が行う方法を知っているので、数字が3の場合、<input type="text" name="username[]" value="" id="users"/>その要素のLiにあるユーザー名で3が作成されます。基本的にユーザーがボタンを押した後、フォームは次のようになります

<form>
    <input type="text" value="User 1" name="username[]" id="users"/>
    <input type="text" value="User 2" name="username[]" id="users"/>
    <input type="text" value="User 3" name="username[]" id="users"/>
</form>

だから私が今持っているコーディングは

$('#form_submit').click(function() {
    var id="#"+ $('.dataSrc').attr('data-id');
    if(id =="#titles_sendto" && $('#ListedAuthSend li').length >= 1) {
        var ListAuthUsers = [];
        var listedAuthUsers = $('#ListedAuthSend li');

        for(var i =0;i<listedAuthUsers.length;i++){
            var name = $(listedAuthUsers[i]).text();
            ListAuthUsers.push(name);
        }
    }
});

http://jsbin.com/ibebax/1/edit コードを視覚的に見る

このようなものは機能しますか？

for(var j=0;j<ListAuthUsers.length;j++){
 var tab = $(ListAuthUsers[i]);
 var html = '<ul>';
 html += '<li>'+tab+'</li>';
 alert(html);
 }
4

5 に答える 5

2

この方法を試してください。

あなたの例とは異なり、IDは一意である必要があるため、これは一意のIDの作成を処理します。

var inputTemplate = $('<input type="text"  name="username[]" />'); //Create a template for the input

$('#form_submit').click(function () {
    var inputs = $('#ListedAuthSend li').map(function (i, ob) {//Use $.map to convert the li's to input.
        return inputTemplate.clone()
               .val(this.innerHTML)
               .attr('id', 'users' + i);
    }).get();

    $('form').html(inputs); //paste it in form.
});

フィドル

于 2013-05-30T03:19:19.200 に答える
0

jQuery.map の使用:

$('#form_submit').click(function() {
   var $list_auth_users = $('#ListedAuthSend li'),
       input = $('<input type="text" name="username[]"></input>')
   ;

   $('form').html(
     $list_auth_users.map(function(index, user){
       var name = $(user).text();
       return input.clone()
         .attr('id', 'user_' + index)
         .attr('value', name);
     }).get()
   );
});

リンクはこちら: http://jsbin.com/ibebax/3/edit

または for ループ

$('#form_submit').click(function() {
   var $users = $('#ListedAuthSend li'),
       input = $('<input type="text" name="username[]"></input>'),
       form_list = [],
       name
   ;


   for (var index = 0; index < $users.length; index++) {
      name = $($users[index]).text();
      $(input.clone().attr('id', 'user_' + index).attr('value', name))
          .appendTo('form'); 
   }
});

リンクはこちら: http://jsbin.com/ibebax/10/edit

今後の参考のために、同じidを持つ複数の要素を持つことはできませんが、同じクラスを持つことはできます

違う：

<div id="f"></div>
<div id="f"></div>

右：

<div id="a" class="f"></div>
<div id="b" class="f"></div>
于 2013-05-30T03:35:10.480 に答える
0

あなたはこれが好きかもしれません

$('#form_submit').click(function() {
    $('form').empty();
    $('#ListedAuthSend li').each(function(k, v){
        var txt = $('<input>',{'name':'username[]','id':'users','value':$(v).text() });
        $('form').append(txt);
    });
});

デモ。

更新:forループの使用

$('#form_submit').click(function() {
    $('form').empty();
    var lis = $('#ListedAuthSend li');
    for(var i=0; i<lis.length;i++){
        var txt = $('<input>',{'name':'username[]','id':'users','value':$(lis[i]).text() });
        $('form').append(txt);
    }
});

デモ。

于 2013-05-30T03:38:43.640 に答える