点击http://jsfiddle.net/4y1b1j8g/30/即可查看。我正在尝试创建一个只允许用户输入一次单词的输入。如果存在单词'dog',则用户不能再次进入dog。但我的代码没有像我期望的那样工作。帮助,欣赏。
$("#input").keydown(function(event) {
var $input = $('#input');
var txtToMatch = $('#test').text();
var iLimit = 1;
var sMatch = $('#input').text().match(txtToMatch);
if (sMatch !== null && sMatch.length > iLimit) {
alert('same word')
}
else {
//put input value into div
var value = $('#input').val();
$('#test').text($('#test').html() + " " + value);
}
});
.test {
display: inline-block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test" id="test">dog</div>
<input type="text" id="input" />
<input type="button" id="button" value="submit" />
答案 0 :(得分:2)
你有一些好主意,但实施不太对。几个关键问题:
keypress
事件,因此每次键入字母时都会触发。实际上,一旦用户输入完文本,你真的想要检查按钮点击。.text
代替.val()
来获取输入值.match()
将输入与现有值进行比较,当indexOf()
与您想要弄清楚的内容相匹配时(即“字符串中是否存在此字词)了吗?“)。解决了这些核心问题,并在此处进行了一些其他调整后,以下代码似乎可以完成您要完成的任务:
$("#button").click(function() {
var value = $.trim($('#input').val());
if (value !== "") {
var txtToMatch = $('#test').text();
var iMatch = txtToMatch.indexOf(value);
if (iMatch !== -1) {
alert('Word already exists!');
}
else {
//put input value into div
$('#test').text(txtToMatch + " " + value);
}
}
});
.test {
display: inline-block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test" id="test">dog</div>
<input type="text" id="input" />
<input type="button" id="button" value="submit" />
编辑: Yong Wang 也提出了一个非常好的观点,数组可能是处理单词集合的更好方法,但是,不知道全部范围你想要做什么,我把它留作了一个字符串。
答案 1 :(得分:1)
你可以这样做
$("#button").click(function(){
var value=$('#input').val();
var toCheck = $('#test').html().split(" ");
var check = value.split(" ");
for(var i=0; i<check.length; i++)
{
if(toCheck.indexOf(check[i])!==-1) check[i]="";
}
$('#test').text($('#test').html() + " " + check.join(" "));
});
工作Fiddle
答案 2 :(得分:1)
使用数组来跟踪所有单词
var words = [];
words.push($("#test").text());
每次单击提交按钮时,请检查此数组。如果数组中不存在输入字,则将其推送到数组
$("#button").click(function(){
//put input value into div
var inputText = $.trim($("#input").val());
if(words.indexOf(inputText)>=0){
alert("Word exists");
return;
}
words.push(inputText);
$('#test').text($('#test').html() + " " + inputText);
});