javascript - 如何访问表单选择 jQuery？如何从输入的金额中获取“%”？

Question

我想建立一个费用计算器，为此我需要访问表单，我想知道我是否可以在 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% 的金额，然后在下面的段落中打印出来。

Answer 1

首先，像这样将 id 添加到您的输入中

<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/

Answer 2

使用 # 符号作为 id。还要在输入中添加一个 id。id="feeInput"

标题也不是有效的输入标签。

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

Answer 3

尝试这个

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);
}

这是一个演示：http: //jsfiddle.net/Ln3RN/

Answer 4

我更改了输出 id 和选择器。 jsfiddle 中的示例

属性选择器

$(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返回 false 以便表单不会提交，只会触发 onsubmit 事件。