Question

我有一个字体下拉选择元素：

<select id="font">
                <option selected value="Font"></option> 
                <option selected=”selected” value="Arial">Arial</option>
                <option value="Calibri">Calibri</option>
                <option value="Century">Century</option>
                <option value="'Comic Sans MS'">Comic</option>
                <option value="'Courier New, Courier, mono'">Courier New</option>
                <option value="'Geneva, sans-serif'">Geneva</option>
 </select>

我想读一个元素的css font-family，下面的cellContent $，并在select中选择该选项：

var fontFamily = cellContent$.css('font-family');
$('#font').val(fontFamily);

上面的代码不起作用，因为fontFamily以“Courier New，Courier，mono”的形式返回，而val参数必须与选项中的内容完全相同。例如，下面的代码有效：

$('#font').val("'Courier New, Courier, mono'");

那么如何才能将css（'font-family'）返回的内容完全转换为选项中的内容，即双引号+单引号+字符串+单引号+双引号？

由于

Answer 1

这是你想要的吗？

var fontFamily = "'" + cellContent$.css('font-family') + "'";
$('#font').val(fontFamily);

修改

你需要这样的方法：

var optionArray = $("#font>option").map(function() { return $(this).val(); }); var fontFamily = cellContent$.css('font-family'); for(var i=0;i<optionArray.length; i++){ if(optionArray[i].indexOf(fontFamily)>0){ $('#font').val(optionArray[i]); } }

在这里小提琴：http://jsfiddle.net/eSwj2/1/

Answer 2

我会从SELECT列表的值中删除所有单引号。

Answer 3

一种方法是连接引号：

var fontFamily = "'" + cellContent$.css('font-family') + "'";
fontFamily = fontFamily.replace(/''/g, "'");
$('#font').val(fontFamily);

更新：在得知您有不确定的报价后，您可以首先从报价中删除所有选项，然后应用值：

$('#font').children("option").each(function() {
    $(this).attr("value", $(this).attr("value").replace(/'/g, ""));
});


var fontFamily = cellContent$.css('font-family');
fontFamily = fontFamily.replace(/'/g, "");
$('#font').val(fontFamily);

请看这个小提琴： http://jsfiddle.net/YJ2Ns/

Answer 4

我尝试从HTML中的选项值中删除单引号但我仍然没有得到.css（'font-family'）返回的值的匹配。结果是因为选项字符串在备用字体之间有额外的空格。但即使我从选项值中取出这些值，我并不总是得到匹配：.css（'font-value'）字符串看起来与选项值相同，当我将它们放在彼此的顶部时，但是没有比赛。要始终获得匹配，我必须复制.css（'font-family'）返回的字符串并将其粘贴到HTML选项值中。

感谢所有建议。

从.css（'font-family'）设置选择选项

4 个答案: