第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在文本輸入字段上設(shè)置自動寬度/長度?

如何在文本輸入字段上設(shè)置自動寬度/長度?

慕勒3428872 2021-12-12 10:49:22
我正在獲取 Stripe 交易費用的價值并通過禁用的文本字段顯示它。由于輸入的文本字段,句子中有很大的空白This is the amount $3.50____________that needs to be paid.我需要什么:(需要縮小差距)This is the amount $3.50 that needs to be paid.如何更改此代碼以在文本字段上使用自動寬度或更改代碼以使用 aspan來獲取交易費用值?這是我想更改的行:<input size='5' id="p-charge" type="number" disabled>如果需要 Codepen:https ://codepen.io/daugaard47/pen/JwLRvZvar Pgoal = document.querySelector('.p-goal');var Ffixed = document.querySelector('#f-fixed');var Fpercent = document.querySelector('#f-percent');var Pcharge = document.querySelector('#p-charge');var checkbox = document.querySelector('#gift-check');var totalBox = document.querySelector('.total-box');var totalDonation = $('.total-box > span');function f(n) {  return Number((+n).toFixed(10));}function calcPcharge(goal, fixed, percent) {  return (goal + fixed) / (1 - percent) - (goal);}function update() {  console.log('update')  var charge = calcPcharge(    f(Pgoal.value),    f(Ffixed.value),    f(Fpercent.value / 100)  );  Pcharge.value = (charge || 0).toFixed(2);    var total = checkbox.checked ? f(Pgoal.value) + f(charge) : f(Pgoal.value);  totalDonation.text(total.toFixed(2));    document.querySelector("input[name='amount']").value = total;}[].forEach.call(document.querySelectorAll('input'), function() {  this.addEventListener('input', update);  this.addEventListener('change', update);});update();checkbox.addEventListener('change', update);input[type="number"]:disabled {  background-color: transparent;  border-style: none;  text-decoration: underline;  color: tomato}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><h2>Cost $<span class="total-box"><span></span></span></h2>
查看完整描述

2 回答

?
慕絲7291255

TA貢獻1859條經(jīng)驗 獲得超6個贊

您可以使用 javascript 根據(jù)該人使用該.value屬性放入輸入的字符數(shù)來計算像素數(shù)。然后.length,您可以使用, 來計算長度,然后將其乘以 10px,例如。



function myfunction() {


   var smallValue = document.getElementById("p-charge");

   var bigValue = smallValue.value;

   var something = bigValue.length;

   something = something*10;

   var somethingElse = something + "px";

   var spannyThing = document.getElementById("forgotwhatidthisisSoReplace");

   spannyThing.style.width = somethingElse;

   setTimeOut(myfunction, 100);

}

myfunction()


查看完整回答
反對 回復(fù) 2021-12-12
?
蕪湖不蕪

TA貢獻1796條經(jīng)驗 獲得超7個贊

基于其他人建議的鏈接并沒有幫助我弄清楚輸入字段的動態(tài)/流體寬度問題。但它確實讓我有動力去弄清楚如何將值放入span元素而不是使用輸入字段。

這是我的解決方案:

HTML:

  1. 刪除了這個 <input id="p-charge"  type="number">

  2. 換成這個 <span id="p-charge"></span>

JS:

  1. 添加這個 var totalFee = $("#p-charge");

  2. 添加這個 totalFee.text((charge || 0).toFixed(2));

var Pgoal = document.querySelector(".p-goal");

var Ffixed = document.querySelector("#f-fixed");

var Fpercent = document.querySelector("#f-percent");

var Pcharge = document.querySelector("#p-charge");

var checkbox = document.querySelector("#gift-check");

var totalBox = document.querySelector(".total-box");

var totalFee = $("#p-charge");

var totalDonation = $(".total-box > span");


function f(n) {

  return Number((+n).toFixed(10));

}


function calcPcharge(goal, fixed, percent) {

  return (goal + fixed) / (1 - percent) - goal;

}


function update() {

  console.log("update");

  var charge = calcPcharge(

    f(Pgoal.value),

    f(Ffixed.value),

    f(Fpercent.value / 100)

  );


  Pcharge.value = (charge || 0).toFixed(2);


  var total = checkbox.checked ? f(Pgoal.value) + f(charge) : f(Pgoal.value);


  totalFee.text((charge || 0).toFixed(2));


  totalDonation.text(total.toFixed(2));


  document.querySelector("input[name='amount']").value = total;

}


[].forEach.call(document.querySelectorAll("input"), function() {

  this.addEventListener("input", update);

  this.addEventListener("change", update);

});


update();


checkbox.addEventListener("change", update);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<h2>Cost $<span class="total-box"><span></span></span>

</h2>


<span>$</span>

<input type="number" min="1.00" max="200000.00" step="0.01" value="60" id="other_amount" name="other_amount" class="p-goal">

<span>USD</span>


<input type="hidden" id="f-fixed" type="number" value="0.30">

<input type="hidden" id="f-percent" type="number" value="2.9">


<p>Gift transaction fee of $<span id="p-charge"></span> so we can get 100% of your payment?</p>

<!-- <p>Gift transaction fee of $ <input id="p-charge"  type="number"> so we can git 100% of your payment?</p> -->


<input type="checkbox" value="yes" name="yes" id="gift-check" autocomplete="off">Yeah, Sure!


<p>Total Amount $<span class="total-box"><span></span></span>

</p>


查看完整回答
反對 回復(fù) 2021-12-12
  • 2 回答
  • 0 關(guān)注
  • 191 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號