jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法

要实现将弹出窗口中选中的内容赋值给文本框，可以通过以下步骤实现：

1. 给选择框添加点击事件，使用jQuery选择器选中选择框，并使用click()事件绑定函数。

$('#selectBox').click(function(){
  // 在函数内部编写后续代码
})

1. 在函数中，打开弹出窗口，监听选择框内容的点击事件，使用jQuery选择器选中选择框内的所有选项，并使用click()事件绑定函数以获取到被选中的项。

  $('#selectBox').click(function(){
    // 弹出窗口代码
    // 监听选择框内容的点击事件
    $('#selections').children('li').click(function(){
      // 选中项的值
      var selectedValue = $(this).text();
      // 赋值给文本框
      $('#textbox').val(selectedValue);
    });
  });

1. 在弹出窗口中，给所有选项添加类名，使用jQuery选择器选中所有选项，使用addClass()方法为每个选项添加类名。

<ul id="selections">
  <li class="option">选项1</li>
  <li class="option">选项2</li>
  <li class="option">选项3</li>
</ul>

$('#selections').children('li').addClass('option');

1. 在弹出窗口中使用CSS样式隐藏所有选项，在选中的选项上应用不同的样式以便用户能够识别出选中项。

#selections li {
  display: none;
}
#selections li.selected {
  background-color: #ccc;
}

1. 在弹出窗口中监听选择框内容的点击事件，使用addClass()方法为被选中的项添加样式类selected，同时移除其他项的样式类。

$('#selections').children('li').click(function(){
  // 移除所有选项的selected类
  $('#selections').children('li').removeClass('selected');
  // 为选中的项添加selected类
  $(this).addClass('selected');
});

示例1：

<input type="text" id="textbox">
<button id="selectBox">选择</button>

$('#selectBox').click(function(){
  $('#selections').show();
});
$('#selections').children('li').click(function(){
  var selectedValue = $(this).text();
  $('#textbox').val(selectedValue);
  $('#selections').hide();
});

示例2：

<input type="text" id="textbox">
<button id="selectBox">选择</button>
<div id="selections">
  <ul>
    <li>选项1</li>
    <li>选项2</li>
    <li>选项3</li>
  </ul>
</div>

#selections {
  position: absolute;
  display: none;
}
#selections li.selected {
  background-color: #ccc;
}

$('#selectBox').click(function(){
  $('#selections').show();
});
$('#selections li').click(function(){
  var selectedValue = $(this).text();
  $('#textbox').val(selectedValue);
  $('#selections').hide();
});
$('#selections li').click(function(){
  $('#selections li').removeClass('selected');
  $(this).addClass('selected');
});