Программа обмена в javascript

-3

Я пытаюсь написать конвертер обмена в javascript в сочетании с HTML и CSS-кодом. Проблема в том, что я не мог преобразовать число из одной валюты в другую, в то время как есть два разных поля: один для ввода значения, а другой для возврата обменного значения. Моя программа просто ничего не конвертирует. Я был бы признателен, если бы вы могли помочь. Ниже весь мой код:Программа обмена в javascript

 <html> 
    <head> 
    <title> Converter </title> 
    <style type="text/css"> 
    div{ 
    width:600px; 
    height:300px; 
    background-color:blue; 
    margin-right: 120px; 
    margin-top: 40px; 
    } 
    #box1{ 
    width: 200px; 
    height: 200px; 
    background-color:red; 
    } 
    #box2{ 
    width:200px; 
    height: 200px; 
    background-color:red; 
    } 
    p{ 
    font-size:12pt; 
    font-family: arial, sans-serif; 
    } 
    nav { font-weight : bold; 
    color: white; 
    border : 2px solid royalblue; 
    text-align: center ; 
    width: 10em; 
    background-color : royalblue;} 
    nav ul { display: none; 
    list-style: none; 
    margin : 0; 
    padding: 0;} 
    nav ul li { border-top: 2px solid royalblue; 
    background-color : white; 
    width: 10em; 
     color: black;} 
     nav ul li:hover { background-color : powderblue;} 
     a { text-decoration: none;} 
     </style> 
     <script type="text/javascript"> 
     function convert(){ 
     if(document.getElementByOptionValue("txtList1")==Euro(EUR) &&     document.getElementByOptionValue("txtList2")==Albania(LEK)){ 
     var eur=document.getElementById("first"); 
     var e=parseFloat(eur.value); 
     if(!validateForm()) 
     return; 
     var l=e*135.82; 
     var lek=document.getElementById("second"); 
     lek.value=l; 
     } 
     if(document.getElementByOptionValue("txtList1")==Albania(LEK) && document.getElementByOptionValue("txtList2")==Euro(EUR)){ 
     var lek=document.getElementById("first"); 
     var l=parseFloat(lek.value); 
     if(!validateForm()) 
     return; 
     var e=l*138.92; 
     var eur=document.getElementById("second"); 
     lek.value=l; 
     } 
     } 
     function validateForm(){ 
     var f=document.getElementById("first"); 
     if(f.value==""){ 
     alert("Jepni nje vlere"); 
     f.focus(); 
     return false; 
     } 
     if(isNaN(f.value){ 
     alert("Vlera qe dhate nuk eshte numer"); 
     f.focus(); 
     return false; 
     } 
     return true; 
     } 
     </script> 
     </head> 
     <body> 
     <div id="box1"> 
     <form action=""> 
     <p>Type a country or a currency</p> 

     <p> <label for="txtList" > 
     <input type="text" id="txtList1" 
     placeholder="United States Dollars (USD)" list="currencies"/> 
    <datalist id="currencies"> 
    <option value="United States Dollars (USD)"> 
    <option value="Euro(EUR)"> 
    <option value="Albania (LEK)"> 
    <option value="Paunds (PAUND)"> 

    </datalist> 
    </label></input></p> 
    <nav>Browse All 
    <ul> 
    <li><a href = "#" >United States Dollars (USD)</a></li> 
    <li><a href = "#" >Euro(EUR)</a></li> 
    <li><a href = "#" >Albania (LEK)</a></li> 
    <li><a href = "#" >Paunds (PAUND)</a></li> 

    </ul> 
    </nav> 
    <p>Please enter an amount </p> 
    <p><label>Currency: 
    <input name = "name" type = "text" id="first" size = "15" 
    maxlength = "10"> 
    </label></p></div> 
    <input type="button" value="=" onclick="convert()"/> 
    <div id="box2"> 
    <p>Type a country or a currency</p> 

    <p> <label for="txtList" > 
    <input type="text" id="txtList2" 
    placeholder="Euro (EUR)" list="currencies"/> 
    <datalist id="currencies"> 
    <option value="United States Dollars (USD)"> 
    <option value="Euro(EUR)"> 
    <option value="Albania (LEK)"> 
    <option value="Paunds (PAUND)"> 

    </datalist> 
    </label></input></p> 
    <nav>Browse All 
    <ul> 
    <li><a href = "#" >United States Dollars (USD)</a></li> 
    <li><a href = "#" >Euro(EUR)</a></li> 
    <li><a href = "#" >Albania (LEK)</a></li> 
    <li><a href = "#" >Paunds (PAUND)</a></li> 

    </ul> 
    </nav> 
    <p>Please enter an amount </p> 
    <p><label>Currency: 
    <input name = "name" type = "text" id="second" size = "15" 
    maxlength = "10"> 

    </label></p></div></form> 
    </body> 
    </html>

Короткий код:

 function convert(){ 
    if(document.getElementByOptionValue("txtList1")==Euro(EUR) && document.getElementByOptionValue("txtList2")==Albania(LEK)){ 
    var eur=document.getElementById("first"); 
    var e=parseFloat(eur.value); 
    if(!validateForm()) 
     return; 
    var l=e*135.82; 
    var lek=document.getElementById("second"); 
    lek.value=l; 
     } 
    if(document.getElementByOptionValue("txtList1")==Albania(LEK) && document.getElementByOptionValue("txtList2")==Euro(EUR)){ 
    var lek=document.getElementById("first"); 
    var l=parseFloat(lek.value); 
    if(!validateForm()) 
    return; 
    var e=l*138.92; 
    var eur=document.getElementById("second"); 
    lek.value=l; 
    } 
    } 
    function validateForm(){ 
    var f=document.getElementById("first"); 
    if(f.value==""){ 
    alert("Jepni nje vlere"); 
    f.focus(); 
    return false; 
    } 
    if(isNaN(f.value)){ 
    alert("Vlera qe dhate nuk eshte numer"); 
    f.focus(); 
    return false; 
    } 
    return true; 
    } 
    </script> 
    </head> 
    <body> 
    <div id="box1"> 
    <form action=""> 
    <p>Type a country or a currency</p> 

    <p> <label for="txtList" > 
    <input type="text" id="txtList1" 
    placeholder="United States Dollars (USD)" list="currencies"/> 
    <datalist id="currencies"> 
    <option value="United States Dollars (USD)"> 
    <option value="Euro(EUR)"> 
    <option value="Albania (LEK)"> 
    <option value="Paunds (PAUND)"> 

    </datalist> 
    </label></input></p> 
    <nav>Browse All 
     <ul> 
     <li><a href = "#" >United States Dollars (USD)</a></li> 
     <li><a href = "#" >Euro(EUR)</a></li> 
     <li><a href = "#" >Albania (LEK)</a></li> 
     <li><a href = "#" >Paunds (PAUND)</a></li> 

</ul> 
</nav> 
<p>Please enter an amount </p> 
<p><label>Currency: 
<input name = "name" type = "text" id="first" size = "15" 
maxlength = "10"> 
</label></p></div> 
<input type="button" value="=" onclick="convert()"/> 
<div id="box2"> 
<p>Type a country or a currency</p> 

<p> <label for="txtList" > 
<input type="text" id="txtList2" 
placeholder="Euro (EUR)" list="currencies"/> 
<datalist id="currencies"> 
<option value="United States Dollars (USD)"> 
<option value="Euro(EUR)"> 
<option value="Albania (LEK)"> 
<option value="Paunds (PAUND)"> 

</datalist> 
    </label></input></p> 
    <nav>Browse All 
    <ul> 
    <li><a href = "#" >United States Dollars (USD)</a></li> 
    <li><a href = "#" >Euro(EUR)</a></li> 
    <li><a href = "#" >Albania (LEK)</a></li> 
    <li><a href = "#" >Paunds (PAUND)</a></li> 

</ul> 
</nav> 
<p>Please enter an amount </p> 
<p><label>Currency: 
<input name = "name" type = "text" id="second" size = "15" 
maxlength = "10"> 

</label></p></div></form> 
</body> 
</html>

источник

2016-11-28 Priscila

Там есть ошибка синтаксиса в 'если (IsNaN (f.value) {'. [Используйте консоль] (http://webmasters.stackexchange.com/q/8525). [Использовать JSHint] (http://jshint.com/). – Xufox

Я исправил эту ошибку, но та же проблема существует – Priscila

Пожалуйста, сваривайте это до 20-30 строк кода. –

Я не уверен насчет логики, что вы собираетесь писать. Но теперь он будет работать для 2-х наборов значений. В первом выпадающем меню выберите «Евро» и введите номер в текстовое поле. Аналогично, выберите «Албания» во втором раскрывающемся списке и нажмите кнопку «=». Теперь второе текстовое поле будет иметь преобразованное значение.

Это позволит начать. :)

<html> 
 
<head> 
 
    <title>Converter </title> 
 
    <style type="text/css"> 
 
     div { 
 
      width: 600px; 
 
      height: 300px; 
 
      background-color: blue; 
 
      margin-right: 120px; 
 
      margin-top: 40px; 
 
     } 
 

 
     #box1 { 
 
      width: 200px; 
 
      height: 200px; 
 
      background-color: red; 
 
     } 
 

 
     #box2 { 
 
      width: 200px; 
 
      height: 200px; 
 
      background-color: red; 
 
     } 
 

 
     p { 
 
      font-size: 12pt; 
 
      font-family: arial, sans-serif; 
 
     } 
 

 
     nav { 
 
      font-weight: bold; 
 
      color: white; 
 
      border: 2px solid royalblue; 
 
      text-align: center; 
 
      width: 10em; 
 
      background-color: royalblue; 
 
     } 
 

 
      nav ul { 
 
       display: none; 
 
       list-style: none; 
 
       margin: 0; 
 
       padding: 0; 
 
      } 
 

 
       nav ul li { 
 
        border-top: 2px solid royalblue; 
 
        background-color: white; 
 
        width: 10em; 
 
        color: black; 
 
       } 
 

 
        nav ul li:hover { 
 
         background-color: powderblue; 
 
        } 
 

 
     a { 
 
      text-decoration: none; 
 
     } 
 
    </style> 
 
    <script type="text/javascript"> 
 
     function convert() { 
 
      if (document.getElementById('txtList1').value == 'Euro(EUR)' && document.getElementById("txtList2").value == 'Albania (LEK)') { 
 
       var eur = document.getElementById("first"); 
 
       var e = parseFloat(eur.value); 
 
       if (!validateForm()) 
 
        return; 
 
       var l = e * 135.82; 
 
       var lek = document.getElementById("second"); 
 
       lek.value = l; 
 
      } 
 
      if (document.getElementById("txtList1").value == 'Albania (LEK)' && document.getElementById("txtList2").value == 'Euro(EUR)') { 
 
       var lek = document.getElementById("first"); 
 
       var l = parseFloat(lek.value); 
 
       if (!validateForm()) 
 
        return; 
 
       var e = l * 138.92; 
 
       var eur = document.getElementById("second"); 
 
       eur.value = e; 
 
      } 
 
     } 
 
     function validateForm() { 
 
      var f = document.getElementById("first"); 
 
      if (f.value == "") { 
 
       alert("Jepni nje vlere"); 
 
       f.focus(); 
 
       return false; 
 
      } 
 
      if (isNaN(f.value)) { 
 
       alert("Vlera qe dhate nuk eshte numer"); 
 
       f.focus(); 
 
       return false; 
 
      } 
 
      return true; 
 
     } 
 
    </script> 
 
</head> 
 
<body> 
 
    <div id="box1"> 
 
     <form action=""> 
 
      <p>Type a country or a currency</p> 
 

 
      <p> 
 
       <label for="txtList"> 
 
        <input type="text" id="txtList1" 
 
         placeholder="United States Dollars (USD)" list="currencies" /> 
 
        <datalist id="currencies"> 
 
         <option value="United States Dollars (USD)"> 
 
         <option value="Euro(EUR)"> 
 
         <option value="Albania (LEK)"> 
 
         <option value="Paunds (PAUND)"> 
 
        </datalist> 
 
       </label> 
 

 
      </p> 
 
      <nav> 
 
       Browse All 
 
      <ul> 
 
       <li><a href="#">United States Dollars (USD)</a></li> 
 
       <li><a href="#">Euro(EUR)</a></li> 
 
       <li><a href="#">Albania (LEK)</a></li> 
 
       <li><a href="#">Paunds (PAUND)</a></li> 
 

 
      </ul> 
 
      </nav> 
 
      <p>Please enter an amount </p> 
 
      <p> 
 
       <label> 
 
        Currency: 
 
       <input name="name" type="text" id="first" size="15" 
 
        maxlength="10"> 
 
       </label> 
 
      </p> 
 

 
      <input type="button" value="=" onclick="convert()" /> 
 
      <div id="box2"> 
 
       <p>Type a country or a currency</p> 
 

 
       <p> 
 
        <label for="txtList"> 
 
         <input type="text" id="txtList2" 
 
          placeholder="Euro (EUR)" list="currencies" /> 
 
         <datalist id="Datalist1"> 
 
          <option value="United States Dollars (USD)"> 
 
          <option value="Euro(EUR)"> 
 
          <option value="Albania (LEK)"> 
 
          <option value="Paunds (PAUND)"> 
 
         </datalist> 
 
        </label> 
 

 
       </p> 
 
       <nav> 
 
        Browse All 
 
       <ul> 
 
        <li><a href="#">United States Dollars (USD)</a></li> 
 
        <li><a href="#">Euro(EUR)</a></li> 
 
        <li><a href="#">Albania (LEK)</a></li> 
 
        <li><a href="#">Paunds (PAUND)</a></li> 
 

 
       </ul> 
 
       </nav> 
 
       <p>Please enter an amount </p> 
 
       <p> 
 
        <label> 
 
         Currency: 
 
        <input name="name" type="text" id="second" size="15" 
 
         maxlength="10"> 
 
        </label> 
 
       </p> 
 
      </div> 
 
     </form> 
 
    </div> 
 
</body> 
 
</html>

источник

2016-11-28 18:14:16

Спасибо, что так много. он работал для этих двух – Priscila

Программа обмена в javascript

ответ

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