如何在单选按钮上弹出文本区域？

Question

我想做this website之类的事情。

如果你点击穷人选项（单选按钮）：

文本区域将出现在灯箱式弹出窗口中：

当点击提交时，它会关闭。

如果有人可以帮我创建类似的东西，请告诉我。

提前致谢。

我自己完成了，感谢所有的sagestion 点击下面的答案

http://jsfiddle.net/Rajeshkrathor/2eEjz/

Answer 1

您可以尝试使用ModalForm。

Answer 2

<div id="somediv"><input type="radio" id="poor" /></div>

js：

$("#poor").on("click", function(){
    $("#somediv").append('<input type="text"/>');
}

如果您希望文本框显示为模态，则可以使用jquery模式

http://jqueryui.com/demos/dialog/#modal-form

Answer 3

最好是收听要点击的change()事件，并检查具有较差单选按钮选项的checked属性，而不是收听广播上的点击。

<input type="radio" name="form_question_1" value="poor" />

与

结合使用

# listen for a change in the status of poor radio button
$('input[value=poor]').change(function() {
  var input_name = $(this).attr('name');
  var input_comment_name = input_name + '_comment';

  # add a comment field when poor is checked
  if ($(this).attr('checked') == 'checked') {
    $(this).append('<input type="text" name="' + input_comment_name + '" />');

  # remove any preexisting comment field if poor is unchecked
  } else if ($('input[name=input_comment_name]').length > 0) {
    $('input[name=input_comment_name]').remove();
  }
});

我没有测试过代码，但它并不是超级干净，但你明白了。

Answer 4

我是自己做的。

请看一下我的评价，以便我能从我的筹码中提升禁令..

请同意链接。

http://jsfiddle.net/Rajeshkrathor/2eEjz/