jQueryが誤って選択したラジオボックスを返すのですか？

Question

jQueryが誤って選択したラジオボックスを返すのですか？

私は以下のように、1つの名前の2つのラジオボタンからなるフォーム入力を持っています：

[thumb] 
<input type="radio" name="type" value="thumb" checked />
[img]<input type="radio" name="type" value="img" />

jQuery関数内では、どのようなものがチェックされているかを参照します。

type=$('input[name="type"]').is(':checked').val();

何らかの理由で、たとえ私がページ上のチェックボックスを変更したとしても、常に前者を返します。

削除の目的で、完全なコードは次のとおりです。

<html>
<head>
<title>Thumb/img BBCode generator</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script>
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />

</head>
<body>
Thumb/img BBCode generator for Facepunch
<div id="content">
<form id="f" action="generate2.php" method="POST">
[thumb] 
<input type="radio" name="type" value="thumb" checked />
[img]<input type="radio" name="type" value="img" />

Insert image links on seperate lines

<input type="button" value="Generate!" id="1_c"/>
</form>
</div>
<script>
 $('#1_c').click(function(){
    var text=$('textarea').val(),
    type=$('input[name="type"]').is(':checked').val();
    $.post('generate2.php', { text: text, type: type },
      function(data) {
          $("#content").html(data);
      });
  });
  function reset(){
    history.go('0');
  }
</script>
</body>

Live version: http://pdo.elementfx.com/thumb/

2

追加された 27 10月 2011 〜で 02:44 著者 SatansFate 編集された 27 10月 2011 〜で 02:53

ビュー: 47

源

ちなみに、IDはアルファベット文字で始まる数字で始まるはずではありません。

追加された 27 10月 2011 〜で 02:54, 著者 Blazemonger, 源

5 答え

実行している問題は、 is セレクタがブール値を返し、一致した要素を返さないということです。つまり、ラジオボタンの代わりに true/false に val（）を呼び出すことになります。

次のセレクタを使用してみてください。

type=$('input[name="type"]:checked').val()

Fiddle: http://jsfiddle.net/fP2P4/1/

6

追加された 27 10月 2011 〜で 02:47 著者 JaredPar

源

@SatansFate私は、私が推薦するセレクターを示しているバイブルの例で私の答えを更新しました

追加された 27 10月 2011 〜で 02:53, 著者 JaredPar, 源

@SatansFateライブサンプルには、私の例のようにセレクタの：checked という接尾辞がありません。これは、チェックされたものを選ぶために必要です

追加された 27 10月 2011 〜で 02:57, 著者 JaredPar, 源

@SatansFateええ、良いコーダーであることの一部は、そのようなダムの間違いをしています。それはちょうど起こる（そしてそれは経験と一緒に逃げない）。 :)

追加された 27 10月 2011 〜で 03:13, 著者 JaredPar, 源

いいえ、そうではありません...毎回「親指」を返します。私はすでにそれを試みました。

追加された 27 10月 2011 〜で 02:52, 著者 SatansFate, 源

また、実例で質問を更新しました.- pdo.elementfx.com/thumb

追加された 27 10月 2011 〜で 02:55, 著者 SatansFate, 源

ああ、私は申し訳ありません - 私はコーディングのために切り捨てられていないことをさらに証明します。私はアーカイブされたバージョンを編集していました。

追加された 27 10月 2011 〜で 03:01, 著者 SatansFate, 源

著者 Blazemonger · Answer 1 · 2011-10-27T02:48Z

代わりにこれを使用してください：

type = $('input[name="type"]:checked').val();

is（ '：checked'）を使用すると、 .val（）を持たないブール（true/false）が返され、エラーが発生します。

著者 Fiona - myaccessible.website · Answer 2 · 2011-10-27T02:50Z

is(':checked') returns true if the element is checked. You don't want it to return true or false, you want to select the element that is checked, so use

type = $('input[name="type"]:checked').val();

著者 jbabey · Answer 3 · 2011-10-27T02:53Z

$（ 'input [name = "type"]'）。prop（ 'checked'）;を使用することもできます。もしあなたが好きなら。

edit: http://jsfiddle.net/pVhn8/

著者 mamoo · Answer 4 · 2011-10-27T02:53Z

The is() method returns a Boolean so it's not clear how you got this statement to work: $('input[name="type"]').is(':checked').val();

代わりに、 $（ 'input [name = "type"]：checked'）。val（）を使用する必要があります。