0

liを使用してul要素を作成しています。liをクリックした後、liからテキスト情報を取得しています。一度私が物を手に入れたら、私はこの親のすべてが子供を持つわけではありませんが、両方を削除することはできません。

これは私の機能です：

$(document).ready(function(){

  var  gender = ['Female','Male'],
      genderField = $('#gender');

   var genderUpdate= function(){
            genderField.focus(function(){
                if(!$('#genderList').length){
                    var topPos = $(this).position().top,lftPos = $(this).position().left;
                    $('<ul id="genderList"></ul>').css({
                        position    :'absolute',
                        top         : topPos,
                        left        : lftPos
                    }).appendTo($(this).parent());


                    $.map(gender,function(val,i){
                        $('<li>'+val+'</li>').appendTo('#genderList');
                        console.log('append');
                    })

                   $('#genderList li').live('click', function(){
                        genderField.attr('value', $(this).text());
                        $(this).parent().remove();//not removing the parent with this sibilings.
                    })

                }


            })
        }

                        genderUpdate();

})

ここにフィドルがあります：

ここをいじる

4

2 に答える 2

1

代わりにこれを試してください：

     $("#genderList li").remove();

また

     $("#genderList li").hide();

http://jsfiddle.net/85DM4/4/

唯一の問題は、一度選択すると再び選択できないことです。いくつかのことを再評価します。最初に選択した後、そのウィンドウをもう一度表示できるようにしたいと思います。

于 2012-05-28T14:46:59.163 に答える
1
  1. .live()JQuery 1.7以降では非推奨ですが、.on()代わりにJQuery1.7以降で使用する必要があります。

  2. HTML属性をで変更したくない場合.attr()、属性はほとんどデフォルト値を表します。Javascriptを使用している場合は、を介して現在のDOMプロパティにアクセスする必要があります.prop()。JQueryを使用してプロパティにアクセスする場合valueは、より単純な.val()JQueryメソッドを使用することをお勧めします。
    何が起こるかというと.attr()、JQuery 1.6より前のHTML属性とDOMプロパティの両方にアクセスして設定するために使用されていたものですが、現在はそうではありません。

  3. Zee Teeの回答を拡張して、ユーザーが入力ボックスをクリックするたびに新しいulを生成する代わりに、切り替えることができる事前定義された非表示のulを使用することもできます。

本当に配列が必要で、CSSを動的に設定しますか？さて、私はそれらの特性を維持し、上記の修正を追加しました。これが動作するJSFiddleです。

編集：フィドルにコメントを追加し、適切にセミコロンを付けました。

于 2012-05-28T15:10:59.363 に答える