2016-09-17 9 views
-3

これで、.val()を呼び出すと値が見つからない動的なテキストボックスがいくつか生成されています。ページの読み込み時にレンダリングされたテキスト入力は.val()で値を返しますが、残りはすべて戻りません。動的に生成されたテキスト要素からval()を取得します

この例では答えが得られない場合は、実際のコードで質問を編集しますが、正確に簡略化するために全力を尽くしました。

はJQuery:

numBoxes = 0 

function newText(){ 
    numBoxes++ 
    $('<div id="' + numBoxes + '"><input id="soft_text_' + numBoxes + 
    '" type="text"></div>').insertBefore($('button#new')) 
} 

function logHard(){ 
    console.log($('input#hard_text').val()) 
} 

function logSoft(){ 
    $('div').each(function(){ 
    console.log($('input#soft_text_' + this.id).val()) 
    }) 
} 

HTML:

<html><body> 
<input id="hard_text" type="text" name="first_text"> 
<button id="new" onclick="newText()">Add new text box</button> 
<button onclick="logHard()">Log first text box</button> 
<button onclick="logSoft()">Log new text boxes</button> 
</body></html> 
+0

テキストがない可能性があります。 – putvande

+0

* "私は正確にそれを簡素化するために全力を尽くしました" *簡素化は良いですが、それは[mcve]でなければなりません。この場合、ブラウザベースの技術であるため、スタックスニペット( '<>'ツールバーボタン)を使用して**実行可能** MCVEにしてください。 –

+0

これはあなたが必要とするものです[このリンクを確認してください](http://stackoverflow.com/questions/38322394/jquery-copy-dynamically-added-table-rowues-into-next-row/38328193#38328193 ) –

答えて

-1

あなたのセレクタを向上させる必要があります。インクリメンタルIDを保持することは、通常、間違ったことをしている兆候です。例えば

...

function newText(){ 
    $('<div class="addedbox"><input type="text"></div>').insertBefore($('button#new')); 
} 
function logHard(){ 
    console.log($('input#hard_text').val()); 
} 
function logSoft(){ 
    $('div.addedbox>input').each(function(){ 
    console.log($(this).val()); 
    }) 
} 
+0

これは誰がOPの問題を解決すると言いますか?これは(長い)コメントでした。 – putvande

+0

私はIDがやや汚れていることに同意しますが、これは実際の問題が何であれ、それが悲しいことではありません。 –

+0

「>」に私を紹介していただきありがとうございます。 – v4gil

0

これは私がこの問題を解決する方法です。 @ニート、それは助けたより良いセレクタを使用するあなたの提案でした。私は将来的にシーケンシャルな識別を必要としないセレクタの使用に向けて取り組んでいますが、これで今日は機能します。

function logSoft(){ 
    $('div').each(function(){ 
    console.log($('div#' + this.id + ' > input').val()) 
    }) 
} 
関連する問題