Question

外部系统生成翻译并用页面上的span文本替换文字。它适用于大多数地方，但它不适用于选择中的选项。他们只支持文字。因此，我的网页存在类似SQL Fiddle sample的问题。

<select class="ProductInfo" >
    <option value=""></option>
    <option value="0">&lt;span class='translation'&gt;Opt1&lt;/span&gt;</option>
    <option value="1">&lt;span class='translation'&gt;Opt2&lt;/span&gt;</option>
</select>

我想要一些jquery / javascript函数，它只用文本替换选项内容，并删除上面的包装。

预期结果：

<select class="ProductInfo" >
    <option value=""></option>
    <option value="0">Opt1</option>
    <option value="1">Opt2</option>
</select>

Answer 1

最好修复模板本身，如果不可能，你可以尝试像

这样的东西

＆＃13;

$('.ProductNoInfo option').text(function(i, t) {
  return $(t).text()
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="ProductNoInfo">
  <option value=""></option>
  <option value="0">&lt;span class='translation'&gt;Opt1&lt;/span&gt;</option>
  <option value="1">&lt;span class='translation'&gt;Opt2&lt;/span&gt;</option>
</select>

＆＃13;

Answer 2

尝试使用decodeURICompoenent

＆＃13;

$("select option").each(function() {
  this.textContent = $(decodeURIComponent(this.textContent)).text()
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select class="ProductInfo" >
    <option value=""></option>
    <option value="0">&lt;span class='translation'&gt;Opt1&lt;/span&gt;</option>
    <option value="1">&lt;span class='translation'&gt;Opt2&lt;/span&gt;</option>
</select>

＆＃13;

Answer 3

试试这个，

$('.ProductNoInfo option').each(function(){
   $(this).text($(this).find('span').text());
});

Answer 4

    <html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

<script>

    $(document).ready(function(){  
        $('.ProductInfo option').each(function () {
            this.textContent = $(decodeURIComponent(this.textContent)).text()
        });


        });  
</script>
</head>
<body>

 <select class="ProductInfo" >
    <option value=""></option>
    <option value="0">&lt;span class='translation'&gt;Opt1&lt;/span&gt;</option>
    <option value="1">&lt;span class='translation'&gt;Opt2&lt;/span&gt;</option>
</select>
</body>
</html>

使用范围文本选择选项

4 个答案: