在母版的子页中编写代码时，文本框的文字限制不能正常工作
在母版的子页中编写代码时，文本框的文字限制不能正常工作
提问于 2019-06-17 16:20:31
我正面临着非常意想不到的问题，在此之前，我不能期望这种类型的问题也会发生…我在单页中编写了文本框的单词限制代码，它工作得100%好，单词限制工作和剩余的单词都通过名为“remaining6”...when的标签显示，我将相同的代码粘贴在主页的子页面中，然后单词限制工作，但剩余的单词不显示：
<input type="text" id="TextBox5" placeholder="latest" runat="server" onkeyup="countChar(this)" />
<h5 >Characters Left <span id="remaining6">20</span></h5>
<script type="text/javascript" >
function countChar(val) {
var len = val.value.length;
if (len >= 10) {
val.value = val.value.substring(0, 10);
}
else
{
$('.numbersofChart').text(10 - len);
alert("before");
var textEntered = document.getElementById('TextBox5').value;
alert("after");
var msg = document.getElementById('remaining6');
var counter = (10 - (textEntered.length));
msg.textContent = counter;
}
};
</script>当我通过alert调试这段代码时，将显示alert("before")，并且alert("after")不是display.it，表示以下行中的错误：
var textEntered = document.getElementById('TextBox5').value;我不知道为什么代码不执行从此行...remember当我运行相同的代码在单页面(没有主)，然后工作的well...the问题发生时，粘贴在主页面的子页面中的代码.我包括库在子页面properly....how我可以解决这个问题吗？
回答 1
Stack Overflow用户
发布于 2019-06-19 08:53:04
下面是一个单词限制示例：
//<![CDATA[
/* js/external.js */
var doc, bod, dE, I, wordLimit; // for use on other loads
addEventListener('load', function(){
doc = document; bod = doc.body; dE = doc.documentElement;
I = function(id){
return doc.getElementById(id);
}
wordLimit = function(context, remainElement, limit){
var s = context.value.split(/[ ]+/), max = limit || 20;
var n = max-s.length;
if(n < 1)n = 0;
remainElement.innerHTML = n;
if(n === 0){
context.value = s.splice(0, max).join(' ');
}
}
var remain = I('remain');
I('textBox').onkeyup = function(){
wordLimit(this, remain);
}
}); // end load
//]]>/* css/external.css */
*{
box-sizing:border-box; padding:0; margin:0;
}
html,body{
width:100%; height:100%;
}
body{
background:#ccc;
}
#content{
padding:7px 5px;
}
#textBox{
width:100%; height:38px; background:#fff; color:#000; font:22px Tahoma, Geneva, sans-serif; padding:5px;
}
h5{
text-align:center;
}
h5>span{
color:#a00;
}<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
<meta charset='UTF-8' /><meta name='viewport' content='width=device-width, height=device-height, initial-scale:1' />
<title>Word Limiter</title>
<link type='text/css' rel='stylesheet' href='css/external.css' />
<script type='text/javascript' src='js/external.js'></script>
</head>
<body>
<div id='content'>
<input id='textBox' type='text' />
<h5>Words Left <span id='remain'>20</span></h5>
</div>
</body>
</html>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56627394
复制相关文章
相似问题
腾讯云开发者
