字體真棒圖標字體作爲佔位符在添加類與jquery後輸入

我想在搜索輸入字段中使用字體真棒圖標作爲佔位符。字體真棒圖標字體作爲佔位符在添加類與jquery後輸入

我使用相應的HTML實體作爲佔位符，然後使用僞類樣式佔位符正確的字體族（實施例2中的jsfiddle）：

HTML：

<div class="wrapper"> 
    <input class="icon" type="text" placeholder="&#61442;" /> 
</div>

CSS：

.wrapper { 
    font-family:'arial', sans-serif; 
} 
input.icon { 
    padding:5px; 
} 
input.icon::-webkit-input-placeholder { 
    font-family:'FontAwesome'; 
} 
input.icon::-moz-placeholder { 
    font-family:'FontAwesome'; 
} 
input.icon::-ms-input-placeholder { 
    font-family:'FontAwesome'; 
}

它按預期工作。

JS：

$(document).ready(function() { 
$('.wrapper input:first').addClass('icon'); 
$('.wrapper input:first').attr("placeholder", "&#61442;"); 
});

它不FONT-FAMILY適用於輸入

的問題，當我嘗試通過jQuery（例如1中的jsfiddle）來添加輸入類和佔位符開始佔位符，只是顯示實體文字。

我試着混合東西，最後放棄。請幫忙！

Jsfiddle examples

P.S：在CSS中使用字體content增加:before輸入包裝不會爲我的具體情況工作的潰敗。

來源

2016-01-17 Acidon

@PhiterFernandes之前嘗試過，只是再試一次 - 它並沒有爲我工作。如果我做錯了，如果你可以更新jsfiddle正確的更改順序來解決問題，我真的很感激它！ – Acidon

你應該首先解析哈希。你可以使用$.parseHTML：

$('.wrapper input:first').attr("placeholder",$.parseHTML("&#61442;")[0].data);

來源

2016-01-17 20:00:38 Filipe

你可以嘗試這樣的事情：

$('.wrapper input:first').attr("placeholder", $('<textarea />').html("&#61442;").html());

JSFiddle

這是通過傳遞值作爲HTML而不是文本，它可以通過創建到不元素的引用來實現真的存在。

來源

2016-01-17 20:00:32

字體真棒圖標字體作爲佔位符在添加類與jquery後輸入

回答

相關問題