Question

我正在做一个项目。我有一些选项，用户选择该选项后，价格就会显示出来。我的代码写在下面

HTML

<select name="package" id="package" onchange="pricingOption()">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select> <br />
<label for="price">Price : </label>
<input type="text" id="price" disabled="disabled" value="$ <?php echo $price ?>">

我有意将<input type="text">设置为禁用状态，以防止用户输入价格:) PHP代码用于将值发送到数据库（MariaDB）。

jQuery

function pricingOption(){
  chosen=document.getElementById("package").value;
  price=document.getElementById("price");
  if(chosen=="A"){
    price+=30;
  }
  else if(chosen=="B"){
    price+=20;
  }
  else if(chosen=="C"){
    price+=10;
  }
}

我的问题是：

尽管我更改了选项，但价格无法在<input type="text">中显示
在<input type="text">中，显示

通知：未定义的变量：价格在 7
行的 C：\ xampp \ datalocation \ file.php 中

所以我写

<?php $price="" ?>

所以在数据库中，价格为0（我将其发送到数据库后）

如何解决此问题？有想法吗？

（请注意我的PHP和jQuery，我对MySQL没问题。我认为，如果我的PHP和jQuery进行得很好，对MySQL的查询将不是问题）

Answer 1

我不确定您想要js代码做什么。这就是我的猜测： +=使我感到困惑。您要添加还是添加数字？

function pricingOption(){
  chosen = $("#package").val();
  price = parseInt($("#price").val());
  
  if(chosen=="A"){
    price+=30;
  }
  else if(chosen=="B"){
    price+=20;
  }
  else if(chosen=="C"){
    price+=10;
  }
  
  $('#price_display').text( "Price: " + price );
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="package" id="package" onchange="pricingOption()">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select> <br />
<label for="price" id="price_display">Price: </label>

<!-- filled by php -->
<input type="text" id="price" disabled="disabled" value="100">

要解决：

通知：未定义的变量：价格在 7
行的 C：\ xampp \ datalocation \ file.php 中

在回显之前，您需要分配$price。请提供您的php代码。

额外

Event-Listener in jQuery（谢谢@Dipesh Parmar）：

$('#package').('input', function() {
    console.log($(this).val());
});

将jQuery计算的结果显示为表单

1 个答案: