2014-11-25 4 views
-1

У меня проблема с чем-то. У меня есть 2 списка опций.Как использовать имена классов?

Каждая опция в одном списке имеет имя M, каждая опция в другом имеет имя R. Мне нужно выбрать определенные параметры, сказать «A» и «C» из обоих списков. Мне нужно добавить бонус «X» к параметрам «X» и «Y» бонус к опциям «Y» («B»).

бонус в виде процента

Таким образом, проблема в том, как я выбираю те опции, а также добавить бонус? Это можно сделать? Мне сказали, что имена классов могут его решить, но как мне это сделать?

  <form action=""> 
 
    <fieldset> 
 
<head> 
 
<script type="text/javascript"> 
 
function myFunction() { 
 

 
    /*Left flank bonus*/ 
 
    var MLef1 = document.getElementById("MeleeL").value; 
 
    var RLef1 = document.getElementById("RangedL").value; 
 
    var ML = MLef1 - 0; 
 
    var RL = RLef1 - 0; 
 

 

 
    
 
    
 
    /*Melee total*/ 
 
    var MT1 = ML; 
 
    var MT2 = MT1/100; 
 
    var MT = MT2 - 0; 
 
    
 
    /*Ranged total*/ 
 
    var RT1 = RL; 
 
    var RT2 = RT1/100; 
 
    var RT = RT2 - 0; 
 
    
 
    
 
    /*Left flank normal*/ 
 
/*Left flank melee*/ 
 
    var x = document.getElementById("Melee").selectedIndex; 
 
    var y = (document.getElementsByTagName("option")[x].value); 
 
    var xy = document.getElementById("LM1").value; 
 
    
 
    
 

 
/*Left flank Ranged*/ 
 
var p = document.getElementById("Ranged").selectedIndex; 
 
    var o = (document.getElementsByName("LR")[p].value); 
 
    var i = document.getElementById("LM1").value; 
 

 
/*Ranged*/ 
 
    var c1 = o * i; 
 
    var c = c1 - 0; 
 
    var RTZ = RT * c; 
 
    var RTz = RTZ - 0; 
 
    
 
    /*Melee*/ 
 
    var z2 = y * xy; 
 
    var z = z2 - 0; 
 
    var MTZ = MT * z; 
 
    var MTz = MTZ - 0; 
 

 

 

 
    /*Zero function*/ 
 

 
    if (MT <= 0) { 
 
     (document.getElementById("result").innerHTML = z); 
 
    } 
 
    else if (MT > 0) { 
 
     (document.getElementById("result").innerHTML = MTz); 
 
    
 
    } 
 
    if (RT <= 0) { 
 
     (document.getElementById("result1").innerHTML = c); 
 
    } 
 
    else if (RT > 0) { 
 
     (document.getElementById("result1").innerHTML = RTz); 
 

 
    
 
    
 
    } 
 
    
 
    
 
    
 
} 
 
</script> 
 

 
     <legend align="center" id="Defense">Defense</legend> 
 
     
 
     <table> 
 
      <tr> 
 
       <th>Left Flank</th> 
 
       <th> 
 
        <th> 
 
         <th>Center Flank</th> 
 
         <th>Right Flank</th> 
 
      </tr> 
 
      <tr> 
 
       <td> 
 
        <label>X Bonus</label> 
 
        <br> 
 
        <label>Y bonus</label> 
 
        <br> 
 
    
 
       </td> 
 
       <td> 
 
        <input type="number" id="MeleeL">% 
 
        <br> 
 
        <input type="number" id="RangedL">% 
 
        <br> 
 
        
 
      </tr> 
 
     </table> 
 

 
     <select id="Melee"> 
 
      <option value="11">A</option> 
 
      <option value="9">B</option> 
 
      <option value="6">C</option> 
 

 
     </select> 
 
     <input type="number" style="width:50px" id="LM1"> 
 
<select id="Ranged"> 
 
      <option name="LR" value="17">A</option> 
 
      <option name="LR" value="4">B</option> 
 
      <option name="LR" value="36">C</option> 
 

 
     </select><br> 
 

 
     
 

 
     <button type="button" id="buton" onclick="myFunction()">Calculate</button><br> 
 
<p id="result">The Melee, </p><p id="result1">The R, </p> 
 

 
    </fieldset> 
 
</form>

Эта сумма изменяется, и будет быть введена через окно ввода. Опять же, мне нужно, чтобы пользователь мог добавить бонус переменной к некоторым, но не ко всем вариантам в списке.

Спасибо за помощь!

+3

Непонятно, что вы просите. Возможно, вы можете показать ожидаемый результат и пример ввода. –

+1

Ваш текст описывает путь больше, чем ваши HTML-шоу. Отредактируйте сообщение, чтобы охватить всю информацию, относящуюся к вашему вопросу, и затем обязательно включите * свой вопрос и укажите название для соответствия. Прямо сейчас ваш титул кажется совершенно не связанным с тем, о чем вы говорите. –

+2

Что вы пробовали? Это сообщение помечено Javascript, но у вас нет кода. –

ответ

0

Я узнал, используя пробную версию, ошибку и пару часов, прочитав инструкции по кодированию, как это сделать. Теперь я использую «data-name1». Это помогает.

<script> 
 
    document.getElementById("selectElement").selectedIndex = -1; // so that no option //is selected when the page is loaded 
 
    // Good!!! 
 
    
 
    function getData(){ 
 
     var e = document.getElementById("qwert"); // get the <select> element 
 
    // Understood 
 
    
 
     var data_name1 = e.options[e.selectedIndex].dataset.name1; // get the selected //<option> and its name1 data attribute 
 
    
 
     
 
    
 
    // var data_name2 = e.options[e.selectedIndex].dataset.name2; get the selected //<option> and its name2 data attribute 
 
    
 
     
 
    
 
     var value = e.options[e.selectedIndex].value; // get the value of the selected <option> 
 
    
 
    
 
    //Result 
 
    document.getElementById("data1").innerHTML = data_name1; 
 
     document.getElementById("value").innerHTML = value; 
 
    } 
 
    </script> 
 
    
 
    
 
    
 
    
 
    
 
    
 
    
 
    
 
    
 
    
 
    
 
    <select id="qwert" onclick="getData()"> 
 
    <option value="135" data-name1="M">Halberdier</option> 
 
       <option value="150" data-name1="R">Lancer</option> 
 
       <option value="51" data-name1="R">Longbowman</option> 
 
       <option value="27" data-name1="M">Militia</option> 
 
    </select> 
 
    
 
    <p> 
 
     <label>data-name1 = </label> 
 
     <span>"</span><span id="data1"></span><span>"</span> 
 
    </p> 
 
    
 
    
 
    
 
    <p> 
 
     <label>value = </label> 
 
     <span>"</span><span id="value"></span><span>"</span> 
 
    </p>

Спасибо за всю помощь, извините о том, неясно. Все самое лучшее