1

選択したオプションを非表示にする次のコードがあります。

function connect()
{
    $(".selectbox option").show();
    $(".selectbox").each(function(i) { 
        var obj = $(".selectbox option[value='" + $(this).val() + "']");
        if($(this).val() != "") obj.hide();     
    }); 
}

function to()
{
    $(".selectboxes option").show();
    $(".selectboxes").each(function(i) { 
        var obj = $(".selectboxes option[value='" + $(this).val() + "']");
        if($(this).val() != "") obj.hide();     
    }); 
}

しかし、今の私の問題は、PHPを使用してselectタグを生成し、そのphpコードで、この値を確認すると、selected=selectedが自動的に追加されるという条件があります。しかし、私のJSは、すでに選択されている場合でも、ドロップダウンにその変数を表示します。追加してみました：

$('.selectboxes option:selected').find("option").hide();

しかし、それは機能しませんでした。この問題をどのように解決すればよいかについてのアイデアはありますか？

ところで：私は言及するのを忘れました、phpコードはその関数を使用する同じ値を持つ複数の選択タグを生成します、したがって私が3つの選択タグを持っているとき1つは事前に選択された値を持ち、他の2つはnullになります値が選択されていないもののいずれか2つをクリックしますが、ドロップダウンで選択1ですでに事前に選択されている選択肢を確認できます。私がやりたかったのは、自動的に非表示にすることです。その機能を使用すると、ドロップダウンから他の選択肢を選択するまで非表示にしないでください。この行以降：

$(".selectbox option").show();

ドロップダウンにすべての選択肢が表示されますが、「this」値を免除するための条件はありますか？

パーツの選択：

for($z=0;$z<$rows_updatedrow;$z++)
{
?>
<select id = "sc" name = "connect_array[]" class="input-select selectbox" onchange = "connect()">
<option value = "">--Select--</option>
<?php
for($zz=0;$zz<$rows_getconnect;$zz++)
{
    $data_getconnect = mysql_fetch_assoc($query_getconnect);
    $field_name_getconnect[] = $data_getconnect['field_name'];
    $field_display_getconnect[] = $data_getconnect['field_display'];
    $field_type_getconnect[] = $data_getconnect['field_type'];
    if((($field_name_getconnect[$zz] == "friends_name" && $connect == 2) || $field_type_getconnect[$zz] == "email") && $z == 0){
    $selected = "selected=selected";
    }else{
    $selected = "";
    }
?>
<option value = "<?php echo $field_name_getconnect[$zz]; ?>" <?php echo $selected; ?>><?php echo $field_display_getconnect[$zz]; ?></option>
<?php
}
?>
</select>
 connect to 
<br/>
<?php
}
?>
</div>
<div class = "right">
<?php
for($a=0;$a<$rows_updatedrow;$a++)
{
?> 
<select name = "to_array[]" class="input-select selectboxes" onchange = "to()">
<option class = "option" value = "">--Select--</option>
<?php
for($aa=0;$aa<$rows_getto;$aa++)
{
    $data_getto = mysql_fetch_assoc($query_getto);
    $field_name_getto[] = $data_getto['field_name'];
    $field_display_getto[] = $data_getto['field_display'];
    $field_type_getto[] = $data_getto['field_type'];
    if((($field_name_getto[$aa] == "friends_name" && $to == 2) || $field_type_getto[$aa] == "email") && $a == 0){
    $selected = "selected=selected";
    }else{
    $selected = "";
    }
?>
<option class = "option" value = "<?php echo $field_name_getto[$aa]; ?>" <?php echo $selected; ?>><?php echo $field_display_getto[$aa]; ?></option>
<?php
}

ありがとうございました

4

4 に答える 4

3

セレクターにすでに選択されたオプションがあります-オプションを見つける必要はありません-それはあなたに空の配列を返すでしょう

$('.selectboxes option:selected').hide();
// get rid of .find('option')

値を免除thisするには..選択した値を参照していると思います..使用できます：未定義の記載としてではありません

$(".selectbox option:not(:selected)").show();

jQueryを使用しているため、インラインのonChangeを取り出して、変更イベントハンドラーをdomreadyのselect要素にバインドできます。

$(function(){
    $('select').change(function(){   
       var $sel = $('option:selected'); // get all selected options
       $('option').show(); // show all options
       $sel.each(function(i,v){ // loop through selected options
           var $index = $(v).index(); // get index of selected option
           $('select').not($(this).parent()).each(function(){  // loop through other select - not current one       
               if($index != 0){ // not default index
                   $(this).find('option').eq($index).hide(); // hide selected option in other dropdowns
               }
           });
       });    
    }).change(); // <-- trigger change right away
});

http://jsfiddle.net/VE7jA/

于 2012-09-24T21:19:14.903 に答える
1 
$('.selectboxes option:selected').find("option").hide();

オプション内で（'option'）を見つけようとしています。これを試してください

$('.selectboxes option:selected').hide();

再度使用する場合は、要素を完全に削除することもできます。

$('.selectboxes option:selected').remove();

値に基づいてオプションを削除するには、試すことができます

$('.selectboxes option[value="0"]').remove() ; // Removes option with value 0
于 2012-09-24T21:34:01.100 に答える
0

言われているように、あなたはオプション内のオプションを見つけようとしているので、あなたは.find呼び出しを取り除く必要があります。

それとは別に、<option>非表示の要素はクロスブラウザでは機能しないため、代わりにオプションを削除し、必要に応じて追加し直す必要があります。これを管理する方法はいくつかありますが、すべてオプションの完全なリストを変数に（配列、オブジェクト、さらにはHTML文字列として）格納する必要があります。

于 2012-09-24T21:28:17.617 に答える
0

要素の非option表示は常にサポートされているわけではありません。より慣用的なアプローチは、それを無効にすることです。

obj.prop("disabled", true);

または、このように単純化します。

$(".selectbox option:selected").prop("disabled", true);

またはこれ。

$(".selectbox").each(function() { 
     this.options[this.selectedIndex].disabled = true; 
});
于 2012-09-24T21:29:57.843 に答える