2016-04-05 38 views
0

我是新來的編碼,我試圖建立一個分數排名,將分數轉化爲符號。用符號創建分數排名

要做到這一點我使用的代碼SOURCE CODE

我需要做的,只是不能就是使其適用於一個以上的時間。我需要像ID+1/ID+2等東西,所以我可以將它應用於所有參賽者。

我有我的pen here

function test_skill() { 
    var junkVal=document.getElementById('score').value; 
    junkVal=Math.floor(junkVal); 
    var obStr=new String(junkVal); 
    numReversed=obStr.split(""); 
    actnumber=numReversed.reverse(); 

    if(Number(junkVal) >=0){ 
     //do nothing 
    } 
    else{ 
     alert('wrong Number cannot be converted'); 
     return false; 
    } 
    if(Number(junkVal)==0){ 
     document.getElementById('container').innerHTML=obStr+''+''; 
     return false; 
    } 
    if(actnumber.length>9){ 
     alert('Oops!!!! the Number is too big to covertes'); 
     return false; 
    } 

    var iWords=["Zero", "<i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>"]; 
    var ePlace=["<i class='fa fa-star-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>", "<i class='fa fa-star-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i><i class='fa fa-moon-o fa-lg'></i>"]; 
    var tensPlace=['dummy', '<i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>', '<i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i><i class="fa fa-star-o fa-lg"></i>' ]; 
    var hundredsPlace=['dummy', '<i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>', '<i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i><i class="fa fa-sun-o fa-lg"></i>']; 

    var iWordsLength=numReversed.length; 
    var totalWords=""; 
    var inWords=new Array(); 
    var finalWord=""; 
    j=0; 
    for(i=0; i<iWordsLength; i++){ 
     switch(i) 
     { 
     case 0: 
      if(actnumber[i]==0 || actnumber[i+1]==1) { 
       inWords[j]=''; 
      } 
      else { 
       inWords[j]=iWords[actnumber[i]]; 
      } 
      inWords[j]=inWords[j]+''; 
      break; 
     case 1: 
      tens_complication(); 
      break; 
     case 2: 
      if(actnumber[i]==0) { 
       inWords[j]=''; 
      } 
      else if(actnumber[i-1]!=0 && actnumber[i-2]!=0) { 
       inWords[j]=hundredsPlace[actnumber[i]]+''; 
      } 
      else { 
       inWords[j]=hundredsPlace[actnumber[i]]+''; 
      } 
      break; 
     case 3: 
      if(actnumber[i]==0 || actnumber[i+1]==1) { 
       inWords[j]=''; 
      } 
      else { 
       inWords[j]=iWords[actnumber[i]]; 
      } 
      if(actnumber[i+1] != 0 || actnumber[i] > 0){ 
       inWords[j]=inWords[j]+" Thousand"; 
      } 
      break; 
     case 4: 
      tens_complication(); 
      break; 
     case 5: 
      if(actnumber[i]==0 || actnumber[i+1]==1) { 
       inWords[j]=''; 
      } 
      else { 
       inWords[j]=iWords[actnumber[i]]; 
      } 
      if(actnumber[i+1] != 0 || actnumber[i] > 0){ 
       inWords[j]=inWords[j]+""; 
      } 
      break; 
     case 6: 
      tens_complication(); 
      break; 
     case 7: 
      if(actnumber[i]==0 || actnumber[i+1]==1){ 
       inWords[j]=''; 
      } 
      else { 
       inWords[j]=iWords[actnumber[i]]; 
      } 
      inWords[j]=inWords[j]+" Crore"; 
      break; 
     case 8: 
      tens_complication(); 
      break; 
     default: 
      break; 
     } 
     j++; 
    } 

    function tens_complication() { 
     if(actnumber[i]==0) { 
      inWords[j]=''; 
     } 
     else if(actnumber[i]==1) { 
      inWords[j]=ePlace[actnumber[i-1]]; 
     } 

     else if (actnumber[i]==2) { 
      inWords[j]=ePlace[actnumber[i-2]]; 
     } 

     else { 
      inWords[j]=tensPlace[actnumber[i]]; 
     } 


    } 
    inWords.reverse(); 
    for(i=0; i<inWords.length; i++) { 
     finalWord+=inWords[i]; 
    } 
    document.getElementById('container').innerHTML=finalWord; 
} 

感謝

+0

請給出一些預期的輸入和輸出。 – wiredniko

+0

是這樣的嗎? http://codepen.io/thdk/pen/pydpGN?editors=1010我可以在後面詳細介紹,但在這裏耗盡時間來接這位女士;) – ThdK

+0

@Thdk感謝它!我認爲這會奏效! – FCCF

回答

0

我已經創建了可能是你在找什麼筆。

我的解決方案允許在html中創建多個輸入字段。

在我的解決方案使用的HTML看起來像這樣:

<div> 
    <input type="text" name="score" value="10" /> 
    <div class="container"></div> 
</div> 
<div> 
    <input type="text" name="score" value="25" /> 
    <div class="container"></div> 
</div> 
<div> 
    <input type="text" name="score" value="5" /> 
    <div class="container"></div> 
</div> 
<div> 
    <input type="text" name="score" value="7" /> 
    <div class="container"></div> 
</div> 
<br/> 
<input type="button" name="sr1" value="Click Here" onClick="go()" /> 

當您單擊按鈕。 jquery函數「each」將循環所有這些輸入框並執行你已經寫過的每個代碼。

function go() { 
    $("input[name=score]").each(function() { 
    test_skill($(this)); 
    }); 
} 

上述函數將爲每個輸入框調用test_skill函數,並將輸入框作爲參數傳遞。

因此,現在改變你的函數test_skill,使用來自作爲參數傳遞的輸入框的值。

function test_skill(input) { 
    var junkVal = input.val(); 
    // some more code you wrote already 
} 

最後,我們需要一個「容器」元素來顯示每個輸入框的結果。使用我公司提供的HTML,我們可以找到正確的div容器和與此代碼填寫比賽成績吧:

function test_skill(input) { 
// more code here 
// replace your last line of test_skill with the line below 
input.parent().find(".container").html(finalWord); 
} 

你可以看到在此筆結果:http://codepen.io/thdk/pen/pydpGN?editors=1010

我希望這可以幫助你。