极限数

如I型在输入字段中的文本，在p元件实况显示的值：http://jsfiddle.net/HC9KD/极限数

如何可以在仅显示多达25第一字符预习？我尝试使用本网站上发现的一些方法，但他们似乎并没有为我工作。

text-overflow: ellipsis - 不行。

欣赏任何想法。

HTML

<p id="preview"></p> 
<input type="text" id="typedtext">

的JavaScript

var wpcomment = document.getElementById('typedtext'); 

wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    document.getElementById('preview').innerHTML = this.value; 
}

来源

2014-02-06 qwaz

试试这个：http://jsfiddle.net/HC9KD/1/

使用slice()作为记录here。

var wpcomment = document.getElementById('typedtext'); 

wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    document.getElementById('preview').innerHTML = this.value.slice(0,25); 
}

更新：

我从ragatskynet的想法，并增加了点结束时，如果输入的字符数是超过25个字符。看到这里的的jsfiddle：http://jsfiddle.net/HC9KD/7/

var wpcomment = document.getElementById('typedtext'); 

wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    document.getElementById('preview').innerHTML = this.value.slice(0,25) + function(x) { 
     if(x.length > 25) { return " ..."} else {return ""}; 
    }(this.value); 
}

来源

2014-02-06 10:05:48 Xiphias

你的第一个例子中的作品为我好。我很欣赏这里的所有答案。 – qwaz

您可以使用substr()。

var wpcomment = document.getElementById('typedtext'); 

wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    if(this.value.length <= 25){ 
     document.getElementById('preview').innerHTML = this.value;  
    } else { 
     document.getElementById('preview').innerHTML = this.value.substr(0,25) + "..."; 
    } 
}

http://jsfiddle.net/HC9KD/4/

来源

2014-02-06 10:06:41 ragatskynet

在我看来，if语句在这里是多余的。 'substr'仍然适用于字符数少于用作截止限制的字符数的字符串。 – Xiphias

当然（我原来的代码是按照你的想法写的），但是如果你不到25个字符，你就不需要添加点。 – ragatskynet

点是一个很酷的想法，确实如此:-) – Xiphias

http://jsfiddle.net/HC9KD/3/

var wpcomment = document.getElementById('typedtext'); 

wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    if (document.getElementById('preview').innerText.length < 25) { 
     document.getElementById('preview').innerHTML = this.value; 
    } 
}

来源

2014-02-06 10:08:19 justtal

如果文本的长度为25个字符或更多，这不会预览任何内容，是不是？ – Xiphias

它会。尝试一下。 – justtal

好的，对不起。你有一个点。尽管如此，一旦达到了字符限制，在我的例子中，在零到二十五个字符的部分中再也没有更新。你注意到了吗？ – Xiphias

尝试......

var wpcomment = document.getElementById('typedtext'); 
var count=1; 
wpcomment.onkeyup = wpcomment.onkeypress = function(){ 
    if(count<=50){ 
     document.getElementById('preview').innerHTML = this.value; 

    } 
    count++; 
}

来源

2014-02-06 10:12:52 Vegeta

回答

相关问题