我想显示具有如下选择选项的国家/地区列表:
<select id="country_code">
<option value="358"> Finland(+358)</option>
<option value="33"> France(+33)</option>
<option value="43"> Austria(+43)</option>
</select>
当用户选择一个国家时,我只想将代码显示为所选选项。
这是我试过的:
$("#country_code").change(function(){
$(this).find("option:selected").text("+"+$(this).find("option:selected").text().match(/(\d+)/g));
})
此代码将代码(正则表达式用于分隔数字)与所选选项分开并显示它而不是全名,并且它有效。
但问题是当我尝试选择其他一些国家时,之前的选项发生了变化!我无法取回它。
看起来像这样:
<select id="country_code">
<option value="358"> +358</option>
<option value="33"> France(+33)</option>
<option value="43"> +43</option>
</select>
我应该如何做到这一点?我在网上搜索没有结果。
最佳答案
我的版本::)
$( "#country_code" ).change( function()
{
var $this = $( this )
$this.find( "option:first" ).text( '+' + $this.val() ).val( $this.val() ).prop( 'selected', true )
} )
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="country_code">
<option value="" style="display: none;" selected="selected">select a country</option>
<option value="358"> Finland(+358)</option>
<option value="33"> France(+33)</option>
<option value="43"> Austria(+43)</option>
</select>
关于javascript - 选择后更改选择选项显示的文本但在更改选择时返回,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41356256/