用javascript和html顯示國家和大洲的資本的代碼

<html> <head> <title>Test</title> </head> <body bgcolor="black" onload="document.getElementById('myedit').value=''"> <font color="white" size="4"><b>Please type the country name to find its capital and continent</b></font> <br> <input type="text" class="resizedTextbox" id="myedit" onchange="editChange()" onkeyup="editChange()" /> <div id="result"> </div> <script type="text/javascript"> // country,capital,continent var cName = new Array(); cName[0] = 'Germany,Berlin,Europe'; cName[1] = 'United States of America,Washington DC,North America'; cName[2] = 'India,New Delhi,Asia'; cName[3] = 'United Kingdom,London,Europe'; function editChange() { obj = document.getElementById('myedit'); s = obj.value.toLowerCase(); res = ''; for (i=0; i<cName.length; i++) { s2 = cName[i].toLowerCase().substr(0, s.length); if (s2 == s && s != '') { sp = cName[i].split(','); res += '<table><tr><td><font color="white" size="5">'+sp[0]+', '+sp[2]+'  '+sp[1]+'<font></td></tr></table>'; } } document.getElementById('result').innerHTML = res == '' ? '<font color="white" size="5"><i>  Not found</i></font>' : res; } </script> </body> </html>

爲什麼不使用indexOf，那麼你會發現這個詞在任何位置，而不僅僅是開始。

if(cName[i].toLowerCase().indexOf(s) != -1){ 
//your code 
}

這將被替換

s2 = cName[i].toLowerCase().substr(0, s.length); 
if (s2 == s && s != '') {

來源

2013-11-01 07:37:10

謝謝托馬斯。這工作。但是當我刪除我寫的東西時，它會顯示整個列表。相反，如果我們從文本框中刪除所有文本時什麼也不顯示，就像它第一次加載頁面時一樣。再次感謝。 – MKT

是否這樣？ 'if（s && cName [i] .toLowerCase（）。indexOf（s）！= -1）{'（見上文）。 – Ben

@Thomas不錯。 +1易於使用，而不是拉出正則表達式，尤其是考慮到我的答案中的結束報價:) – Ben

的技巧是使用RegExp。這裏有一個重寫和清理，有幾個提示註釋。

<html><head><title>Test</title></head><body> 

<b>Please type the country name to find its capital and continent</b> 
<br> 
<input type="text" class="resizedTextbox" id="myedit" /> 
<div id="result">&nbsp;</div> 

<script type="text/javascript"> 

var cName = new Array(); 
cName[0] = 'Germany,Berlin,Europe'; 
cName[1] = 'United States of America,Washington DC,North America'; 
cName[2] = 'India,New Delhi,Asia'; 
cName[3] = 'United Kingdom,London,Europe'; 

function editChange() { 
    // THIS keyword will usually be the object you're looking for 
    // (but careful, it's "powerful", see what I wrote later). 
    var str = this.value.toLowerCase(); 

    // Make a new regex from the search string. 
    var regex = new RegExp(str); 

    // Store all results in an array so they're easy to work with later. 
    var res = []; 

    // Cache length so JS doesn't have to recalculate each time. 
    var len = cName.length; 

    for (i = 0; i < len; i++) { 
     // Here's the trick - cName will look to see 
     // if anything from inside the regex matches. 
     // For example, /sta/ will be found in "united states" 
     if (cName[i].toLowerCase().match(regex)) { 
      res.push(cName[i]); 
     } 
    } 

    // No need to make a new table for every entry...right? 
    document.getElementById('result').innerHTML = res.join("<br>"); 
} 

// Try to separate functionality from markup. Leave your HTML clean 
// and put JS stuff in JS. :) 
document.getElementById('myedit').onkeyup = editChange; 

</script> 
</body> 
</html>

正則表達式是一個強大的話題。當編碼員說「強大」時，他們通常意味着複雜而令人頭痛的事情，但卻具有驚人的功能。

正則表達式就是這樣，一旦你掌握了它，它很有趣，也很有幫助。這是解決您的問題的好方法。

我留給你一個popular quote：

一些人，當遇到一個問題，認爲「我知道，我將使用正則表達式。」現在他們有兩個問題。

來源

2013-11-01 07:39:06 Ben

嘿史蒂夫！感謝您提供的所有建議。每當我下次編碼時，我都會盡力實現它們。還有一件事。請閱讀我對托馬斯答案的評論。希望你可以添加一些東西。謝謝 – MKT

@MKT - 很簡單：'if（s && cName [i] .toLowerCase（）。indexOf（s）！= -1）{'感謝您的反饋。我會感激upvote，但他是一個更好的答案海事組織，更優雅。無論如何，請記住一旦你明確表示答案爲「解決」。有趣的問題BTW。 – Ben

試圖投票了這兩個答案。但似乎我需要更多的聲譽，然後才能投票給任何答案。 – MKT

用javascript和html顯示國家和大洲的資本的代碼

回答

相關問題