Question

我的屏幕截图中是否有类似输入元素的更改。

enter image description here

我想通过javascript更改值，并使用不同的颜色突出显示部分文本，如果它将用*包装

感谢您的帮助。

Answer 1

您无法使用输入元素执行此操作。这是另一种选择：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <style>
    /*style it to look like input element*/
    [contenteditable] {
        border: 1px solid gray;
    } 
  </style>
</head>
<body>
<div id="contentDiv" contenteditable>sdfsdtokendfdfsdfs</div>
<br/>
<input type="button" onclick="test()" value="Click me"/>
<script type="text/javascript">
function test() {
    // this is our token
    var valueToSelect = "tokendfdf";
    var contentDiv = document.getElementById('contentDiv');

    // check if div contains wanted token
    if (contentDiv.innerHTML.indexOf(valueToSelect) >= 0) {
        // create span with wanted color
        var replaceString = '<span style="color: red">*' + valueToSelect + '*</span>';
        // replace the string with colored span
        contentDiv.innerHTML = contentDiv.innerHTML.replace(valueToSelect, replaceString);
    }   
}
</script>
</body>
</html>

以下是JS Bin示例

输入突出显示文本部分

1 个答案: