我嘗試比較兩個資料值。通過ajax jquery呼叫從資料庫中獲取一個值
function marketbuyshow(){
$.ajax({
type: "GET",
url: "/showmarketbuydata",
dataType: "json",
success: function (response) {
$("#balance").html("");
$.each(response.balancedata,function(key,item){
$('#balance').append('<span>' item.mybalance '</span>');
});
另一個從輸入值中獲取。我有這個表格用于資料輸入，價格/金額/總輸入
<form>
<div class="title"> </div>
<div >Avaliable Balance : <span id="balance"></span></div>
<div class="mb-3">
<label for="">Price</label>
<input type="text" id="price" required class="price form-control" />
</div>
<div class="mb-3">
<label for="">Amount</label>
<input type="text" id="amount" required class="amount form-control" />
</div>
<div class="mb-3">
<label for="">Total</label>
<input type="text" id="total" required class="total form-control" readonly />
</div>
<button type="submit" id="btnn" class="btn btn-primary marketbuy">Buy</button>
</form>
如果總值大于可用余額，我想通過 jquery 禁用購買按鈕，如下所示，但此余額值不起作用。雖然在前端顯示資料，但它以空字串傳遞，無法實時比較。
let balan = $('#balance').val();
console.log(balan);
let total = $('#total').val();
console.log(total);
if(total >balan){
console.log($('#total').val());
$("#btnn").attr("disabled", true);
}else{
// console.log("total is less than ");
$("#btnn").attr("disabled", false);
}
如何實時獲取余額值，并在輸入表單中輸入總值時進行比較。我怎樣才能做到這一點 。請有人幫助我。
uj5u.com熱心網友回復：
解決方案的總體思路：
對于實時，您可以考慮使用 Socket.io（HTML 版本）。這樣，您將創建與服務器的直接雙向連接。這樣，您可以在后端更改時將新值推送到客戶端。任何時候你在輸入中寫入，你都可以在 onChange 中將用戶輸入與 Socke.io 推送的當前值進行比較，該值會不斷實時更新。
為什么我推薦 Socket.io？
原諒我，我拆開了你的整個代碼，我知道這一點，但是，我想讓你知道對問題的處理略有不同。Socket.io 是一個干凈的解決方案，因為服務器僅在該值實際更改時才與您聯系，因此客戶端您不需要長輪詢或類似的東西。
uj5u.com熱心網友回復：
跨度不會有 val()。如果要使用 val()，請將其設為只讀輸入。您還可以使用 .text() 來獲取跨度中的內容。
uj5u.com熱心網友回復：
這是獲取跨度內容的示例：
https://jsfiddle.net/642s8nau/2/
<form>
<div class="title"> </div>
<div >Avaliable Balance : <span id="balance">1000</span></div>
<div >Another Value : <span id="anotherValue">500</span></div>
<button type="button" id="getValues" class="btn btn-primary">Compare Values</button>
</form>
$(document).on("click", "#getValues", function (event) {
alert(Number($("#balance").text()) > Number($("#anotherValue").text()));
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/504991.html
標籤：javascript html jQuery 阿贾克斯