2014-10-13 3 views
0

Я новичок в JavaScript, самозанятый, используя бесплатные pdf-книги, google и Stackoverflow. Я застрял в назначенной мне задаче ...подкачки с числовыми, используя поиск по javascript

Обмен словами с числовыми цифрами, взятие значений из одного текстового поля, выполнение обмена и сдача результата в другом текстовом поле. Например, когда я печатаю шесть Svn ZrO выхода должна быть 670

Но когда я печатаю что-то в textBox1 результате в TextBox2 является «Неопределенным» **

Пожалуйста отладить это только с помощью простого JavaScript, не JQuery.

Вот мой код ...

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript"> 
function myFunction() 
{ 
    var a = ["one","two","tri","for","fiv","six","svn","egt","nin","zro"]; 
    var b = [1,2,3,4,5,6,7,8,9,0]; 
    var str = document.getElementById("textBox1").value; 
    var x = document.getElementById("textBox2").value; 
    var len = str.length; 

     for (var k=0; k < 200; k++) 
      { 
      var n = str.search(new RegExp(a[k], "i")); 
      var str1 = str.substring(0, n) + b[k] + str.substring(n+3, len); 
      document.getElementById('textBox2').value = str1.toString(); 
      }; 
} 
</script> 
</head> 
<body> 
<input type="text" onkeyup="myFunction();" id="textBox1" autofocus/> 
<br><br><br><br><br><br> 
<input type="text" id="textBox2" /> 
</body> 
</html> 
+0

Could вы добавляете то, что точно не работает в данный момент? Тогда мы можем помочь вам лучше. Одна простая вещь, которую я вижу, это то, что цикл for достигает 200, но массив 'a' содержит только 10 элементов, поэтому' a [k] 'вызовет проблемы. 'k Rhumborl

+2

Для 0-9 Я бы порекомендовал иметь «var a = [« zro »,« one »,« two »,« tri »,« for »,« fiv », «six», «svn», «egt», «nin»]; 'поскольку [digit] вернет требуемую строку – mplungjan

+0

thanx Rhumborl, я получил эту вещь, но проблема в том, что я ввожу что-то в textBox1 результат в textBox2 «undefined» –

ответ

0

Причина вы получаете undefined еще из цикла for.

Когда k достигает 10, a[10] не существует и поэтому возвращает undefined. Это используется как значение замены в вашей строке.

Если вы ограничиваете k длиной массива a, вы не получите неопределенные значения.

Другая проблема заключается в том, что вы всегда начинаете с исходной строки, поэтому предыдущие замены игнорируются. Вы должны всегда использовать str и не иметь str1.

И, наконец, проще просто использовать функцию replace(), а не подстраивать подстроки - я попытался повторно использовать код подстроки, но не смог заставить его работать.

Так что ваша функция может стать:

function myFunction() { 
 
    // values to search for - these can be strings or a regex string 
 
    var a = ["zro", "one", "two", "tri", "for", "fiv", "six", "svn", "egt", "nin"]; 
 

 
    // get the input value 
 
    // we will perform all replacements against this 
 
    var str = document.getElementById("textBox1").value; 
 

 
    // loop through the array and replace each value in "str" with its index 
 
    // note we are reusing "str" each time to keep the previous replacements intact 
 
    // replace() can take either a string or a regex 
 
    for (var k = 0; k < a.length; k++) { 
 
     // put "zro" at the start of "a" so "k" is now the same as b[k] - no need for "b" 
 
     // create a RegExp from the string, set it to global replace (g) so it works if there is more than one match in the string, and case insensitive (i) in case they type "One" 
 
     str = str.replace(new RegExp(a[k], "gi"), k); 
 
    }; 
 

 
    // store final value in the other textbox 
 
    document.getElementById('textBox2').value = str; 
 
}
<input type="text" onkeyup="myFunction();" id="textBox1" autofocus="autofocus" /> 
 
<br/> 
 
<input type="text" id="textBox2" />

EDIT/сноски: replace() еще проще, но вы может использования substring() - проблема с исходным кодом, что если регулярное выражение ничего не соответствует, n будет -1 и беспорядок str. Таким образом, вы должны проверить, если n > -1, прежде чем делать подстроку часть:

for (var k = 0; k < a.length; k++) { 
    var n = str.search(new RegExp(a[k], "i")); 
    if(n > -1) { 
     // n+a[k].length is better than n+3, in case a[k] isn't 3 chars! 
     str = str.substring(0, n) + k + str.substring(n+a[k].length, str.length); 
    } 
}; 
+0

thanx man, но вот проблема с вашим кодом, когда я набираю «шесть шесть» (два раза шесть), он перенастраивает «6 шесть» в результате –

+0

вам нужно используйте регулярное выражение с глобальным (g) флагом. Я обновил ответ, чтобы использовать этот – Rhumborl

+0

thnx a ton Rhumborl. –

0

Вот мое предложение

function myFunction() { 
 
    var a = ["zro","one","two","tri","for","fiv","six","svn","egt","nin"]; // 0-based 
 
    var str = document.getElementById("textBox1").value; 
 
    var words = str.split(" "),len=words.length, str1=""; // split on words 
 
    for (var i=0; i < len; i++) { // run over length of array 
 
    var idx = a.indexOf(words[i]); // find the word in the index array 
 
    if (idx !=-1) str1+=idx; 
 
    } 
 
    if (str1) document.getElementById('textBox2').value=str1; 
 
}
<input type="text" onkeyup="myFunction();" id="textBox1" autofocus/> 
 
<br><br><br><br><br><br> 
 
<input type="text" id="textBox2" />

Если вы хотите иметь какой-либо элемент, содержащий любой из а [], то это сделает это

function myFunction1() { 
    var str = document.getElementById("textBox1").value; 
    var a = ["zro","one","two","tri","for","fiv","six","svn","egt","nin"]; 
    var len = a.length; 
    for (var i=0; i < len; i++) { 
    var idx = str.indexOf(a[i]); // or str.toUpperCase().indexOf(a[i].toUpperCase()) 
    if (idx !=-1) str = str.split(a[i]).join(i); // or use substr if case insensitive 
    } 
    if (str) document.getElementById('textBox2').value=str; 
} 
+0

thanx mplungjan, но когда я набираю oone (приклеенный с o), он ничего не возвращает –

+0

Но это не в вашем случае использования, поэтому я не обрабатываю его. «трюк» должен затем вернуть 3ck - непонятно в соответствии с вашей спецификацией - см. обновление для этой версии – mplungjan

Смежные вопросы