2013-02-18 64 views
-2

我想循環使用一個數組,以查找不斷變化的特定字符集。從那裏開始,我想切換這些字母的大小寫,並且我被告知要使用這個特定的代碼,但是我無法使它工作。該代碼必須循環遍歷字符數組,其中字符來自「輸入」文本框。我怎樣才能解決這個問題?在字符數組中循環

我應該提到,我在高中上課,所以我沒有接近完美的編碼。


<html> 
     <head> 
     <script type="text/javascript"> 
    function toggleCase() { 
     var i = document.getElementById("input").value.length; 
     var word = document.getElementById("input").value; 
     var chop =new array(i); 
     for (a=i; a <= i; a++) { 
      character[i] = word.slice(i-1,i) 
      if (character[i] == character[i].toUpperCase;){ 
       character[i] = character[i].toLowerCase(); 
      } 
      else { 
       character[i] = character[i].toUpperCase(); 
      } 
     } 

     var final 

     for (a=i; a <= i; a++) { 
      final += character[i]; 
     } 

     document.getElementById("output").value = final 
    } 
     </script> 
     </head> 
     <body> 
     <p>Enter letters for conversion:</p> 
     <form> 
      <input type="text" name="input" id="input" value="sample" maxlength="10"><br /> 
      <input type="text" name="output" id="output" value="" /> <br/> 
      <input type="checkbox" name="toggle" value="ToggleCase" onClick="toggleCase(this.form)">Toggle Case<br/> 
     </form> 
     </body> 
    </html> 
+0

javascript不是java,使用正確的標記 – Jimmt 2013-02-18 20:04:32

+0

您在循環中多次調用'document.getElementById(「input」)'多次獲得性能命中。 – jbabey 2013-02-18 20:08:37

+0

你錯過了每個地方的分號! – Birla 2013-02-18 20:10:34

回答

0

也許你應該看看一些API和HOWTO文檔,但這裏是你的代碼:

<html> 
<head> 
<script type="text/javascript"> 
function toggleCase() { 
    var text = document.getElementById("input").value; 
    var character = new Array(text.length); 

    for (i=0, a = text.length; i < a; i++) { 
    character[i] = text[i]; 
    if (character[i] == character[i].toUpperCase){ 
     character[i] = character[i].toLowerCase(); 
    } 
    else { 
     character[i] = character[i].toUpperCase(); 
    } 
    } 

    document.getElementById("output").value = character.join(''); 
} 
</script> 
</head> 
<body> 
<p>Enter letters for conversion:</p> 
<form> 
<input type="text" name="input" id="input" value="sample" maxlength="10"><br /> 
<input type="text" name="output" id="output" value="" /> <br/> 
<input type="checkbox" name="toggle" value="ToggleCase" onClick="toggleCase()">Toggle Case<br/> 
</form> 
</body> 
</html> 
0
function toggleCase() { 
    var str = document.getElementById("input").value; 
    for (var i=0; i<str.length; i++) { 
    str[i] = (str[i]==str[i].toUpperCase() ? str[i].toLowerCase() : str[i].toUpperCase()); 
    } 
    document.getElementById("output").value = str; 
} 

這是一個for循環,沒有工作。並記住.toUpperCase.toLowerCase是函數

0

您可能想看看字符串的拆分方法。

var str = 'foo bar baz'; 

將字符串轉換爲char數組最簡單的方法是將空字符串傳入split方法。

var charArray = str.split(''): 
// charArray === ['f','o','o' ... 'b','a','z']; 

另外一個FYI,傳遞一個空格字符到分裂將給你一個單詞陣列。

var wordArray = str.split(' '); 
// wordArray === ['foo', 'bar', 'baz']; 

我有點不清楚,你有什麼解決,但它看起來像你想有一個功能轉換大寫字母爲小寫字母,反之亦然。

var userInput = document.getElementById('someTextBox'); 
// If you want to be fancy you could use JQuery 
// var userInput = $(#someTextBox').value() 

function toggledCase(str) { 

    var characters = str.split(''); 
    // The split method still uses iteration so should be able to say it 
    // satisfies the argument of looping through each character. 
    // Split just provides a good abstraction to interface with. 

    var toggledCharacters = []; 
    var i; 
    var ch; 
    for(i in characters) { 
     // For in loops on strings will return the indexes instead 
     // of the characters 
     ch = characters[i]; 

     if(ch.toUpperCase() === ch){ 
      toggledCharacters.push(ch.toLowerCase()); 
     } else { 
      toggledCharacters.push(ch.toUpperCase()); 
     } 

     // If you like one-liners, 
     // the conditional if statement could be replace with a ternay statement. 

     // toggledCharacters.push((ch.toUpperCase() === ch) ? 
     // ch.toLowerCase() : ch.toUpperCase(); 
    } 

    return toggledCharacters; 
} 

我toggledCharacters方法只返回一個字符數組,所以如果你想要回爲一個字符串,你可以做一個for循環;

var arr = toggledCharacters('Foo'); // str = 'fOO'; 
var str = ''; 

var i, ch; 
for (i in arr) { 
    str += arr[i]; // += is just a short hand notation of saying 
        //  str = str + arr[i]; 
} 

如果你懶惰,喜歡單行程序,看看函數式編程。因爲你還在高中,所以它有點兒超出了範圍。

var arr = toggledCharacters('Foo'); // str = 'fOO'; 
var str = arr.reduce(function(str, ch) { 
    return str + ch; 
}); 

無論如何,這看起來比老師概述的要乾淨得多。

function toggledCharacters(input) { 
    input = input.split(''); 
    var output = []; 

    var i, ch; 
    for(i in input) { 
     output.push((input[i].toUpper() === input[i]) ? 
      input[i].toLower() : input[i].toUpper() 
     ); 
    } 

    return output.reduce( 
     function(str, ch) { 
      return str + ch; 
     } 
    ); 
} 

編輯:

噢,我還注意到,無處在代碼正在評估檢查的盒子布爾值。

var checkBox = document.getElementByName('toggle'); 
var inputTextBox = document.getElementById('input'); 
var outputTextBox = document.getElementById('output'); 

var result = inputTextBox.value; 

if(checkBox.checked) { 
    result = toggleCase(result); 
} 

outputTextBox.value = result; 

哦,因爲你是初學者還有另一個FYI。確保你知道使用瀏覽器的控制檯。

如果你在Firefox上,抓住螢火蟲應用程序。

Chrome,請按Ctrl-Shift-C。

IE也有一個,我只是不在乎使用它。

控制檯使得用JS進行試驗變得更容易,然後與製作HTML演示頁面相比,並假設代碼正常工作。

另外,這些開發人員工具可以顯示對象的基礎方法。它爲學習JS提供了一個絕佳的方法。