2013-04-11 4 views
0

Я хочу построить калькулятор платы, и для этого мне нужно получить доступ к формам, я задавался вопросом, могу ли я сделать это в jQuery. Так что мой код является то, что:Как получить форму формы jQuery? Как получить «%» от введенной суммы?

<form id="fee"> 
    <input type="text" title="fee" placeholder="Place the amount that you would like to send"/> $ 
    <input type="submit" onclick="getFee()"/> 
</form> 
<br/> 
<p id="Here will be the fee"></p> 

И JS:

function getFee(){ 
    $("fee > input:fee"). 
} 

Вот моя проблема. Я хочу знать, как получить сумму, введенную пользователем во вход, и добавить к этой сумме 10%, а затем распечатать ее в абзаце ниже.

+0

В будущем, пожалуйста, постарайтесь быть более последовательными в своих вопросах и дать полное объяснение того, что вы пытаетесь сделать. –

ответ

1

Прежде всего, добавить идентификатор к введенному как этот

<input type="text" id="amount" 

Теперь получить значение, как это:

var amount = $("#amount").val(); 

Не используйте пробелы в вашем ID

<p id="Here will be the fee"></p> 

Используйте это вместо

<p id="feeOnAmount"></p> 

Теперь вы можете добавить 10% на сумму, как этот

function getFee(){ 
    var amount = parseFloat($("#amount").val()); 
    if($.isNumeric(amount)){ 
     $("#feeOnAmount").html((amount * 1.1));  
    } 
    else{ 
     $("#feeOnAmount").html("please enter a valid number"); 
    } 
} 

http://jsfiddle.net/mohammadAdil/E2rJQ/15/

+1

Вы можете упростить свою арифметику до '(сумма * 1.1)' –

+0

Спасибо большое! Помогли мне много! И как я могу уточнить, что пользователь вводит только цифры? –

+0

Вы должны использовать 'parseFloat' вместо' parseInt'. try: 'parseInt (010);'. – andlrc

0

Используйте знак # для идентификатора. Также добавьте идентификатор на вход. id="feeInput"

Также название не является допустимым тегом ввода.

function getFee(){ 
     $("#fee > input#feeInput"). 
    } 
0

Попробуйте

function getFee(){ 
    var inputVal = $("#fee > input[title='fee']").val(); 
    var inputFinal = parseInt(inputVal) + (parseInt(inputVal) * .10); 

    //Change the ID of the p your appending to 
    //ID is now = "calc" 
    $("#calc").text(inputFinal); 
} 

Heres демо: http://jsfiddle.net/Ln3RN/

0

Я изменил выходной идентификатор и селектор. example in jsfiddle

attribute selectors

$(document).ready(function() { 
    $("#fee")[0].onsubmit= getFee; 

}); 
function getFee(){ 
     var feeInput = $('#fee > input[title="fee"]').val(); 
     feeInput = parseInt(feeInput); 
     $('#Here_will_be_the_fee').text(feeInput*1.1); 
     return false; 
} 

getFee возвращает ложь, так что форма не представит, только вызвать onsubmit событие.

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