当您点击复选框

时间:2015-12-28 18:15:57

标签: jquery

我有多个复选框

<input value="78" name="download_category[]" id="in-download_category-78" type="checkbox">
<input value="84" name="download_category[]" id="in-download_category-84" type="checkbox">
....
<input value="93" name="download_category[]" id="in-download_category-93" type="checkbox">

我输入了文字

<input class="fes-name-value" name="option[0][description]" id="options[0][description]" rows="3" value="" type="text">
<input class="fes-name-value" name="option[1][description]" id="option[1][description]" rows="3" value="" type="text">

我想为下面的任务编写jQuery:

如果用户选中第一个选项,该选项的值将自动插入第一个文本框。如果用户取消选中第一个选项,则第一个文本框将隐藏。

如果用户继续检查第二个选项,则添加第二个文本框,并将选项的值插入第二个文本框。如果用户取消选中,则隐藏第二个文本框。

您最好的解决方案是什么? 感谢。

2 个答案:

答案 0 :(得分:1)

单击复选框,首先检查是否已选中。如果检查比添加输入,否则删除相关输入....我不知道你是如何设置输入的名称所以只是举个例子。希望它能帮到你

return Auction::where('end_date', '>', Carbon::now() )
         ->where('locale', $locale)
         ->where('sold', 0)
         ->where(function($query) use ($request){

             if( ! empty($request->input('prices')) ){
                  $opts = $request->prices;
                  $query->where('price_id', $opts[0]);
             }
         })->paginate(8);

答案 1 :(得分:0)

试试这个:

  $('input:checkbox').on("click",function()
  {
    if($(this).is(":checked"))
    {
      $(this).next('input').show();
      $(this).next('input').val($(this).val());
    }
    else
    $(this).next('input').hide();    
  });

示例:https://jsfiddle.net/DinoMyte/sj910khv/5/