0

リンクと選択ボックスのセットがいくつかあります。私のhtmlコードは以下です

<div>
    <div>
        <a href='#' onclick='set_checked(false,"checkbox1")'>clear</a>
        <a href='#' onclick='set_checked(true,"checkbox1")'>select</a>
    </div>
    <div>
        <input type='checkbox' name='checkbox1'/>
    </div>
</div>

<div>
    <div>
        <a href='#' onclick='set_checked(false,"checkbox2")'>clear</a>
        <a href='#' onclick='set_checked(true,"checkbox2")'>select</a>
    </div>
    <div>
        <input type='checkbox' name='checkbox2'/>
    </div>
</div>

今私の要件は、selectリンクをクリックしたときに、その引数に基づいてチェックボックスをオンにする必要があることです。クリアの場合は反転します。ここでは、2 つのパラメーターを渡します。1 つはブール値を渡すことです (つまり、true の場合はチェックし、そうでない場合はチェックを外します)。もう 1 つは、チェックボックス フィールドの名前引数を渡すことです。
そして、次の関数を使用してチェックボックスをオンまたはオフにしています

function set_checked(checked,inputFeildName){
   $('input[name=inputFeildName]').attr('checked',checked);
}

しかし、上記のコードは機能していません。そして、これは私のフィドルhttp://jsfiddle.net/vu6fs/5/です。

チェックボックスを選択する前に、すべてのクリアリンクを無効にする必要があり、チェックボックスを選択した後、それぞれのクリアリンクを有効にする必要があります。不透明度を適用し、javascript で「無効」プロパティも適用していますが、機能していません。誰かが私の障害がどこにあるのか

教えてください。誰か助けてください。前もって感謝します

4

5 に答える 5

2

jQuery 1.6+

function set_checked(checked,inputFeildName){

   $('input[name="'+ inputFeildName +'"]').prop('checked',true);

}

jQuery 1.5 以下

function set_checked(checked,inputFeildName){

   $('input[name="'+ inputFeildName +'"]').attr('checked','checked');

}

質問の拡張の例を次に示します（さらに必要な場合は、aチェックボックスの変更に関するタグの無効化/有効化について）

CSS

.disButton {
    background: transparent;
    border: none;
}
.disButton a {
    text-decoration: none;
    color: #ddd;
}

jQuery

$('input:checkbox').on('change', function() {
    enable_clear(this, this.checked);
}).change();

function enable_clear(el, checked) {
    var target = $(el).parent('div').prev('div').find('a:contains(clear)');
    if (checked) {
        target.unwrap();
    } else {
        target.wrap($('<button/>', {
            disabled: true,
            'class': 'disButton',
            width: target.width() + 'px'
        }));
    }
}
$('a').on('click', function(e) {
    e.preventDefault();
    var target = $(this).parent().next('div').find('input:checkbox');
    if (!target.is(':checked') && $(this).text() == 'select') target.click();
    if ($(this).text() == 'clear') target.click();
});

デモ

于 2012-05-09T09:47:37.523 に答える
1

あなたは私が以下のようにした文字列を追加するのを忘れます、これはあなたの問題を解決します

function set_checked(checked,inputFeildName)
{
    $('input[name="'+ inputFeildName+'"]').attr('checked',checked);
}
于 2012-05-09T09:46:24.927 に答える
1

あなたのフィドルにはいくつかのエラーがあります：

  • 関数set_checkedは onLoad-Handler で (選択されているように) 宣言されており、ローカルでのみ使用でき、グローバル スコープでは使用できません。「ラップなし (ヘッド)」を選択してラッピング機能を削除するか、機能を に割り当てますwindow.set_checked。
  • 属性はチェックボックスのデフォルト値checkedのみを表すことに注意してください。実際の状態を変更するには、プロパティを使用する必要があります (jQuery ではval()を使用できます)。checked
  • デフォルト値を変更したい場合、属性を (文字列) に設定しても変更できませんfalse。removeAttribute()属性は、その存在によってチェックされたチェックボックスを表します。無効にするために使用する必要があります。defaultCheckedプロパティをブール値で使用する方が簡単です。
  • 最後になりましたが、他のすべての人によって検出された明らかなエラーがあります。変数を使用するには、名前を文字列に入れる代わりに変数を使用する必要があります (PHP のように) 。

また、属性idよりも sに満足しているかもしれません。name私はあなたのフィドルを適切な解決策で更新しました: http://jsfiddle.net/vu6fs/7/

不適切な場合にクリア/選択リンクを無効にするには:

  • disableフォーム要素のようにリンク (アンカー) を作成することはできません( javascriptを使用してリンクを無効にする、jQueryリンクを無効にする 、 css を使用してリンクを無効にする を参照)。OK、実際にはその機能を無効にする必要はありません (何も変更されません)。
    これは CSS で行うことができ、ユーザー変更イベントと を介した設定の両方で更新をトリガーする必要がありますset_checked。http://jsfiddle.net/vu6fs/9/のサンプルコード
  • チェック状態を切り替えるリンクを 1 つだけ使用する方が簡単な場合があります。その文字は、現在の状態に応じて「クリア」と「選択」の間で変化する場合があります。

これらのリンクを任意のチェックボックス要素に動的に追加するプラグイン(つまり、jQuery プロトタイプ関数) を作成しました。つまり、グローバル スコープ汚染set_checked関数の代わりに (スコープ付きの) クリック ハンドラーを使用することもできます。

于 2012-05-09T10:31:20.293 に答える
1

これがあなたがやろうとしていることだと思います...ところで、スペルミスfieldがあるので、変数/属性を再度使用するときは注意してください。

function set_checked(checked,inputFeildName){
   $('input[name="'+inputFeildName+'"]').attr('checked',checked);
}
于 2012-05-09T09:47:00.953 に答える
0

関数には少しエラーがあります:

function set_checked(checked,inputFeildName){  
     $(**'input[name='+inputFeildName+']'**).attr('checked',checked);
}
于 2012-05-09T09:57:43.753 に答える