2017-02-16 2 views
1

мой код:как передать значение флажок для функции яваскрипта

<input type="checkbox" name="area" id="area" value="0">Some Text1</input> 
<input type="checkbox" name="area" id="area" value="80">Some Text2</input> 

и Javascript код

function calc(){var textValue1 = document.getElementById('quantity').value; 
var textValue2 = document.getElementById('area').value; 
document.getElementById('cost').value = textValue1 * textValue2 ; } 

, но он не работает.

+0

Где ваш код PHP? – FreedomPride

+0

append правильный html-код – m87

+1

@Niger: Ваш HTML-код имеет одинаковый идентификатор в обоих. Он должен быть другим для обоих флажков. – mi6crazyheart

ответ

0

Попробуйте это:

valueChange = function(item){ 
 
\t alert(item.value); 
 
}
<form name="form1" method="post" action=" insert_data.php"> 
 
    Delivery Location 
 
    <input onChange="valueChange(this)" type="checkbox" name="area" id="area" value="0">Inside city </input> 
 
    <input onChange="valueChange(this)" type="checkbox" name="area" id="area" value="80">Outside city </input> 
 
    </form>

0

Sample пример с помощью JQuery ...

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 

      $("#target").submit(function(event) { 
       $('input[name="vehicle"]:checked').each(function() { 
        console.log(this.value); 
       }); 

       return false; 
      }); 

     }); 
    </script> 
</head> 
<body> 
    <form id='target' action="/action_page.php"> 
     <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> 
     <input type="checkbox" name="vehicle" value="Car" checked> I have a car<br> 
     <input type="submit" value="Submit"> 
    </form> 
</body> 
</html> 
0

Проблема заключается в том, что id атрибуты должны быть уникальными. В вашем случае у вас есть 2 элемента с id="area", что смущает метод document.getElementById(). Вы можете использовать запрос выбора для достижения желаемого. Нет необходимости в дополнительных библиотеках, таких как jQuery.

Вот рабочий пример:

function calculate() { 
 
    var selected = document.querySelector('[name="area"]:checked') 
 
    
 
    if (!selected) { 
 
    alert('Please select a value') 
 
    return 
 
    } 
 
    
 
    var quantity = 5 // you can get this from a different place 
 
    
 
    alert('Final value: ' + selected.value * quantity) 
 
    
 
} 
 

 

 
document.getElementById('submit').addEventListener('click', calculate)
<form name="form1" method="post" action=" insert_data.php"> 
 
    Delivery Location 
 
    <input type="checkbox" name="area" id="inside" value="0">Inside city </input> 
 
    <input type="checkbox" name="area" id="outside" value="80">Outside city </input> 
 
    <button id="submit">Calculate</button> 
 
</form>

0

попробуйте ниже JS код в консоли. вы можете использовать его в соответствии с событиями u want

var checkedValue = null; 
var inputElements = document.getElementsByName('area'); 
for(var i=0; inputElements[i]; ++i){ 
     if(inputElements[i].checked){ 
      checkedValue = inputElements[i].value; 
      break; 
     } 
} 
Смежные вопросы