Question

我对JQuery很新。我已经可以从文本框中获取数据并进行一些计算并将其显示给其他文本框＆＃39;虽然我想把它发布到＆＃39; div＆＃39;或者＆＃39; p＆＃39;无论它是什么，只要不是文本框。

这是我的代码

<div id="result" style="display:none;">
    <div class="col-sm-5 text-right"><label>Participant fee (IDR):</label></div>
    <div class="col-sm-7"id="parcost" ></div>
    <div class="col-sm-5 text-right"><label>Populi fee (IDR):</label></div>
    <div class="col-sm-7"><input type="text" id="popcost"></div>
    <div class="col-sm-5 text-right"><label>Total Estimated Cost (IDR):</label></div>
    <div class="col-sm-7"><input type="text" id="totcost"></div>
</div>



$(document).ready(function(){
$('#calc').click(function(){
        var num_participant = parseInt($("num_participant").val());
        var reward = parseInt($("reward").val());
        var esttime = parseInt($("esttime").val());
        var parcost = num_participant*reward;
        var popcost = (parcost*0.1)+(num_participant*150);
        var totcost = parcost+popcost;
        /*
        document.getElementById("result").style.display = "block";
        document.getElementById("parcost").value = parcost;
        document.getElementById("popcost").value = popcost;
        document.getElementById("totcost").value = totcost;*/

        document.getElementById("result").style.display = "block";
        $("#parcost").html(parcost);
        $("#popcost").html(popcost);
        $("#totcost").html(totcost);


        return false;
});

});

如果我从＆＃34; document.getelementById＆＃34;更改它仍然无法工作到＆＃34; $＆＃34;。甚至使用＆＃34; document.getelementById＆＃34;它不会在＆＃34; div＆＃34;上显示出来。

任何想法？

Answer 1

我不确定你是否在问这个但是尝试这样的事情，

var totCost = document.getElementById("totcost").value;
$("#yourDivID").html(totCost);

Answer 2

我不确定您的要求但是如果您想将结果发送给div，请使用$("#divId").html(result)

Answer 3

我认为你必须使用.text或.html .value。使用jquery：

查看此example

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>text demo</title>
  <style>
  p {
    color: blue;
    margin: 8px;
  }
  b {
    color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<p><b>Test</b> Paragraph.</p>
<p></p>

<script>
var str = $( "p:first" ).text();
$( "p:last" ).html( str );
</script>

</body>
</html>

Answer 4

如果您希望在div中添加结果，请尝试：

jQuery("#divID").append("<p>" + data + "<p>");

Answer 5

要更新<div>或<p>元素的内容，您可以使用innerHTML代替value。因此，在您的示例代码中，您将更新此行：

document.getElementById("parcost").value = parcost;

进入这个：

document.getElementById("parcost").innerHTML= parcost;

此外，由于您已经在使用jQuery，因此可以简化点击功能：

$('#calc').click(function(){
    var num_participant = parseInt($("#num_participant").val());
    var reward = parseInt($("#reward").val());
    var esttime = parseInt($("#esttime").val());
    var parcost = num_participant*reward;
    var popcost = (parcost*0.1)+(num_participant*150);
    var totcost = parcost+popcost;
    $("#result").css("display", "block");
    $("#parcost").html(parcost);
    $("#popcost").val(popcost);
    $("#totcost").val(totcost);
});

我的JQuery将数据发布到＆＃39;文本框＆＃39;如何发布到＆＃39; div＆＃39;？

5 个答案: