1

3つ(またはそれ以上)の通常のボタンが必要です。3つの画像の下で使用します。1つだけに「デフォルト」というテキストが表示され、他のボタンには「デフォルトとして設定」というテキストが表示されます。

<input type="button" id="button1" value="Default" > 

<input type="button"id="button2"  value="Set as default" > 

<input type="button" id="button3"  value="Set as default" >  

「デフォルトに設定」をクリックすると、このボタンのテキストがデフォルトに変更され、色も変更されます。(以前のデフォルトのボタンは「デフォルトに設定」になります)

  1. 3つ以上のボタンにjqueryを使用してこれを行うにはどうすればよいですか?
  2. これをphpに投稿すると、どれがデフォルトであったかをどのように知ることができますか?
  3. デフォルトの画像を選択するためのボタンの代わりに他の提案/コード例がある場合は、大歓迎です
4

3 に答える 3

4
$('input[type="button"]').on('click', function() {
  $('input[type="button"]').val('Set as default');
  $(this).val('Default');
});

PHP は名前を付けることで認識します: (button1, 2, 3) - 値は「デフォルト」になります。

<input type="button" id="button1" name="button1" value="Default" > 

<input type="button"id="button2"  name="button2"  value="Set as default" > 

<input type="button" id="button3"  name="button3"  value="Set as default" > 
于 2013-01-17T17:02:38.323 に答える
1

1) セレクターをコンマで組み合わせることができます。

$("#button1, #button2, #button3").on("click", function(){
  $("#button1, #button2, #button3").val("Set as default");
  $(this).val("Default");
});

2) 隠し入力を追加して、必要なものをキャプチャできます ( <input type='hidden' id='selectedbutton'>)。

$("#button1, #button2, #button3").on("click", function(){
  $("#button1, #button2, #button3").val("Set as default");
  $(this).val("Default");
  $("#selectedbutton").val($(this).attr("id"));
});

3) ラジオ ボタンは、1 つだけが選択されていることを強制し、サーバーに通知するためにも機能するため、優れたオプションです。テキストを手動で変更する必要があります (CSS を使いこなしたい場合を除きます)。

ETA: 色や他のスタイルをコントロールしたいとおっしゃいましたね。フォーマットと選択の両方でクラスをより有効に活用することをお勧めします。

HTML

<input type="button" id="button1" class='btn-set-default btn-is-default' value="Default" > 
<input type="button"id="button2" class='btn-set-default' value="Set as default" >    
<input type="button" id="button3" class='btn-set-default' value="Set as default" >  

Jクエリ:

$(".btn-set-default").on("click", function(){
  $(".btn-set-default").removeClass("btn-is-default").val("Set as default");
  $(this).addClass("btn-is-default").val("Default");
  $("#selectedbutton").val($(this).attr("id"));
});

CSS

.btn-set-default { }
.btn-is-default { color:red; }
于 2013-01-17T17:05:01.343 に答える
1

試す-

$(function(){
    $(":button").click(function(){
      $(":button").prop('value','Set as default');
        $(this).prop('value', 'Default'); 
    });
});

http://jsfiddle.net/KDkqL/

値「デフォルト」で投稿されるものは、クリックされたものです。

于 2013-01-17T17:05:28.613 に答える