0

クリックすると、その特定の製品がショッピングカートに追加される単一のボタンに<label/>andを変換しようとしています。<input type="radio"/>この例では、複数のバリエーションを持つ可能性のある 1 つの製品を扱います (つまり、製品は「デニム ジーンズ」、バリエーションはサイズ「26」、「27」、「28」になります)。

HTML は次のようになります。

<label for="radio_denim26">
  <span>26</span>
  <input type="radio" style="position:absolute;top:-30px;left:-30px;" value="denim26" id="denim26" checked="checked" onfocus="form.submit();" onchange="form.submit();" />
</label>

<label for="radio_denim27">
  <span>27</span>
  <input type="radio" style="position:absolute;top:-30px;left:-30px;" value="denim27" id="denim27" checked="checked" onfocus="form.submit();" onchange="form.submit();" />
</label>

<label for="radio_denim28">
  <span>28</span>
  <input type="radio" style="position: absolute;top:-30px;left:-30px;" value="denim28" id="denim28" checked="checked" onfocus="form.submit();" onchange="form.submit();" />
</label>

**上の CSS は<input/>、ラジオ ボタンを非表示にするためのものです*

これは IE 8、IE 7、および IE 6 で正常に動作します (驚くべきことに!) Safari/Chrome でも動作します。Firefox では動作しません。特定のバリエーション、たとえば「27」をクリックすると、グループ内の最後のバリエーション、つまり「28」がカートに追加されます。

最後にonfocus="form.submit();"、Firefox では正常に動作しますが、IE 7 では動作しません。

4

2 に答える 2

1

ラジオ ボタン タグには、おそらく "name" 属性が必要です。実際にラジオ ボタンのように機能するように、名前はそれぞれ同じにする必要があります。

于 2009-10-12T17:38:11.653 に答える
0

属性のラベルは、入力の ID を指す必要があります。配置は問題ではありません。それらは非表示になっているか、画面の反対側にある可能性があります。ラベルの @for が入力の @id を指している限り、問題ありません。

すなわち。

<label for="denim1">
    <span>28</span>
</label>
<input type="radio" ... id="denim1" />

w3schools タグ ラベルの例をご覧ください

ところで。素敵なサイト！: )

于 2009-10-12T17:56:22.177 に答える