Question

有谁能帮助我如何完成以下任务？

我有一个下拉字段，它有花名。默认值是＆＃34;选择你喜欢的花＆＃34;。点击或单击时，下拉列表将打开并显示选项列表，当用户选择特定值时，该字段将显示所选花卉名称。

我需要追加收藏花：然后选择值。你能帮我解决一下这个问题吗？

请看图片：

<select> 
  <list> Select your favorite flower</list> 
  <list>Rose</Rose> <list>Marigold </list>
  <list>Lily</lily> 
</select>

Answer 1

使用更改事件，将带有文本的范围附加到所选选项：

$('select').on('change',function() {
$('option').find('span').remove();//remove previous selected span
var val = $(this).find(':selected').html();//get the text/html of the potion
$(this).find(':selected').html('<span>Favorite Flower: </span>'+val);//change the text with the option
});

https://jsfiddle.net/r5377h21/

或：

$('select').on('change',function() {
$('option').find('span').remove();
var selected = $(this).find(':selected'),
    val = selected.html(); 
if(!selected.is('option:first')) {
$(this).find(':selected').html('<span>Favorite Flower: </span>'+val);
}
});

https://jsfiddle.net/r5377h21/1/

Answer 2

请你试试this。

如果您需要更改，请告诉我

代码：

<script>
function test(obj)
{
  $("select option").each(function(){
     $(this).text($(this).text().replace("favorite flower - ",""))
  })
  if($("option:selected",$(obj)).val() != -1){
  $("option:selected",$(obj)).text("favorite flower - "+$("option:selected",$(obj)).text())
  }
}
</script>
<select onchange="test(this)">
  <option value="-1">Select your favorite flower</option>
    <option>Rose</option>
    <option>Marigold</option>
  <option>Lily</option>
</select>

如何动态更新选择值？

2 个答案: