Question

我正在为网页创建一个Bookmarklet，并且遇到了一个Span id =“totalAmount”元素（摘要表），该元素通常通过单击将值手动输入到输入字段（id =“Amount”）后填充进入它并键入值。我可以使用Bookmarklet成功输入值，但不填充Span id =“totalAmount”元素。我错过了什么？

这是HTML

<input id="Amount" class="with-prefix sum-amount" type="tel" value="" name="Amount" data-val-required="Please enter your amount" data-val-regex-pattern="^\d*\.?\d{0,2}$" data-val-regex="Please enter the amount" data-val-reasonableincome="" data-val-number="The field What is your amount? must be a number." data-val="true" aria-describedby="AmountTooltip"/>

<div class="summary-table clearfix">
<div class="summary-table-item">
<span class="text">Total amount</span>
<span class="curr-sign">£</span>
<span id="totalAmount" class="value"/>
</div>

手动将值输入到输入字段时，span元素将填充相同的值并且代码将更改为：

<span id="totalAmount" class="value">25000.00</span>

但是当我使用以下Bookmarklet时，虽然输入字段已成功输入值，但“totalAmount”跨度未填充

javascript: var newPage = {
    formFill: function() {
        document.querySelectorAll("#Amount")[0].value = '25000';
    }
};
newPage.formFill()

注意：由于权限原因，我无法修改HTML

非常感谢

Answer 1

span不是input元素，它有innerHTML，而不是value

document.getElementById( "Amount" ).onchange = function(){
   document.getElementById("totalAmount").innerHTML = this.value;
}

Answer 2

首先，跨度未正确关闭。请更正。

查询发生在Input元素而不是span。

如果您希望跨度填充输入元素中输入的值。您必须编写一个执行计算的函数。这可以绑定到键盘事件。

Answer 3

// use this code and close span tag.

javascript: var newPage = {
  formFill: function() {
     document.querySelectorAll("#Amount")[0].value  = '25000';
     document.getElementsByClassName(".curr-sign").textContent = '25000';
     document.getElementById("totalAmount").textContent = "25000";
  }
};
newPage.formFill();

如何触发Span元素填充输入字段（Javascript）中输入的值

3 个答案: