0

質問するのにあまりにも頻繁にここに来ているように感じますが、それでも行き詰まっています。テキストエリアを選択して、別のテキストエリアのテキストを編集できるようにしようとしています。これは、テキストボックスを使用しても問題なく機能しますが、テキストエリアでは機能しません。div コンテナをクリックするたびに、テキストエリアを探すときに未定義の結果が得られます。以下はコードです。

jQuery

     $(".textAreaContainer").live('click','div', function(){
        var divID = this.id;
        if ( divID !== "" ){

            var lastChar = divID.substr(divID.length - 1);
            var t = $('#' + divID ).find(':input');
            alert(t.attr('id'));

            t = t.clone(false);               
            t.attr('data-related-field-id', t.attr('id'));              
            t.attr('id', t.attr('id') + '_Add');
            t.attr('data-add-field', 'true');

            var text = document.getElementById(divID).innerHTML;
            //var textboxId = $('div.textAreaContainer').find('input[type="textArea"]')[lastChar].id;
            $('div#placeholder input[type="button"]').hide();
            var text = "<p>Please fill out what " + t.attr('id') +" Textarea shall contain</p>";

            if ( $('#' + t.attr('id')).length == 0 ) {
                $('div#placeholder').html(t);
                $('div#placeholder').prepend(text);
            }
        }
        else{

        }
    });

t.attr('id') は textbox1 (または同様のもの) を返す必要がありますが、代わりに undefined を返します。

私は .find(':textarea'),.find('textarea'),.find(text,textArea),.find(':input') と、グーグルで見つけた他のかなりの数を試しましたが、すべてそれらは undefined を返しますが、その理由はわかりません。デモはhttp://jsfiddle.net/xYwaw/にあります。助けてくれてありがとう、感謝しています。

編集: 以下は、私が使用している非常によく似た例のコードです。これは私がやりたいことですが、テキストエリアではなくテキストボックスを使用します。

     $('#textAdd').live('click',function() {
        var newdiv = document.createElement('div');
        newdiv.innerHTML = "Textbox " + textBoxCounter + " <br><div id='container" + counter + "' class='container'><li><input type='text' id='textBox" + textBoxCounter +"' name='textBox" + textBoxCounter + "'></li></div></br>";
        document.getElementById("identifier").appendChild(newdiv);
        textBoxCounter++
        counter++;
    });
    $(".container").live('click','div', function(){
        var divID = this.id;
        if ( divID !== "" ){
            var lastChar = divID.substr(divID.length - 1);
            var t = $('#' + divID).find('input');
            alert(divID);


            t = t.clone(false);
            t.attr('data-related-field-id', t.attr('id'));
            alert(t.attr('id'));
            t.attr('id', t.attr('id') + '_Add');               
            t.attr('data-add-field', 'true');


            var text = document.getElementById(divID).innerHTML;
            // var textboxId = $('div.container').find('input[type="text"]')[lastChar].id;
            $('div#placeholder input[type="button"]').hide();
            var text = "<p>Please fill out what " + t.attr('id') +" textbox shall contain</p>";

            if ( $('#' + t.attr('id')).length == 0 ) {
                $('div#placeholder').html(t);
                $('div#placeholder').prepend(text);
            }
        }
        else{

        }
    });
4

1 に答える 1

1

最初に、最初の行から 2 番目のパラメーター「div」を削除します。

$(".textAreaContainer").live('click','div', function(){

...それを作るには：

$(".textAreaContainer").live('click', function(){

次に変更します。

var t = $('#' + divID ).find(':input');

...に：

var t = $(this).find(':input');

それがコンテナーであることは既にわかっているためthis、ID で再度選択する必要はありません。また、textarea コンテナーに割り当てている id 属性にはスペースが含まれていますが、これは無効であり、元のコードが の子孫であるタグ'#textAreaContainer 0'を実際に検索する要素を選択しようとします。そのため、要素を作成するコードを修正して ID 内のスペースを削除することは、一般的には良い考えであり、この問題を修正する別の方法でもあります。0#textAreaContainer

于 2012-07-17T14:36:46.213 に答える