-1

こんにちは、ライブフィルター関数を作成していますが、異なるクラスからチェックボックスの値を送信するのに問題があります:

<input type="checkbox" onclick="return test();" class="type" name="type1" value="1"  /> Trousers <br />
<input type="checkbox" onclick="return test();" class="type" name="type3" value="3"  /> T-shirts <br />
<input type="checkbox" onclick="return test();" class="type" name="type2" value="2"  /> Jackets <br />

<input type="checkbox" onclick="return test();" class="color" name="color1" value="1"  /> Red <br />
<input type="checkbox" onclick="return test();" class="color" name="color3" value="3"  /> Blue <br />
<input type="checkbox" onclick="return test();" class="color" name="color2" value="2"  /> Green <br />

このコードを使用すると、すべてのチェックボックスから動的に値を取得できます。

function test() {
    var counter = 0, 
        i = 0,       
        url = 'items.php?',    
        input_obj = $('input[type=checkbox]');


    for (i = 0; i < input_obj.length; i++) {
        if (input_obj[i].type === 'checkbox' && input_obj[i].checked === true) {
            counter++;
            url = url + '&a=' + input_obj[i].value;
        }
    }
    if (counter > 0) {
        alert(url);

    }
}

しかし、異なるクラスには異なる URL 名が必要で(type - &a=value, color - &b=value)あり、これらすべてを 1 つの URL に結合する必要があります。

4

2 に答える 2

3

チェックボックスは、クラスを使用するのではなく、同じ名前（[]PHPを使用しているため、その名前で終了）を付けてグループ化します。次に、を使用serializeして、Ajaxリクエストのエンコードされたデータを生成します。

例：_

<form>

<label><input type="checkbox" name="type[]" value="1"  /> Trousers </label>
<label><input type="checkbox" name="type[]" value="3"  /> T-shirts </label>
<label><input type="checkbox" name="type[]" value="2"  /> Jackets </label>

<label><input type="checkbox" name="color[]" value="1"  /> Red </label>
<label><input type="checkbox" name="color[]" value="3"  /> Blue </label>
<label><input type="checkbox" name="color[]" value="2"  /> Green </label>

</form>

および

$('input[type=checkbox]').on('click', function () {
    alert($(this.form).serialize());
});​
于 2012-07-19T11:36:39.740 に答える
0

何を表現しようとしているのか理解するのに時間がかかりました...

おそらく、チェックボックスが選択されるとすぐに、チェックボックスの現在の状態を1つのURLに送信したいと思います。

そのメカニズムがすべての onclick でどのように機能するかはよくわかりません... コードを再構築することをお勧めします。

これらの onclick 定義を入力チェックボックスから削除し、代わりに test() ルーチンを、チェックボックスがクリックされたときに発生する JavaScript イベントにバインドします。jQuery などの JavaScript ライブラリを使用すると、これがより便利になります。バインドにさまざまな jQuery セレクターを使用すると、さまざまなイベントに対してさまざまな反応を示すことができます。たとえば、チェックボックスのクラスによるフィルター処理などです。

$('input.type').on('click',function(e){test('type',e);});
$('input.color').on('click',function(e){test('color',e);});

または、単一のバインドを使用して、パラメーター「e」として渡されたイベントを評価することもできます。これを使用して、クリックされた要素のクラスを読み取ることができます。

お役に立てれば。それ以外の場合は、実際に何をしたいのかをより明確にするようにしてください。あなたの目標は、「異なるクラスには異なるURL名がある」ということではありませんが、チェックボックスの値のようなものを異なるURLに送信するか、ブラウザを異なるURLに転送する必要があります...

于 2012-07-19T11:41:44.600 に答える