【问题标题】:Calculate a total from autocomplete suggestion.data从自动完成的建议中计算总数。数据
【发布时间】:2015-08-19 03:15:07
【问题描述】:

我正在尝试编写一个带有自动完成搜索表单的小型 Jquery 程序。我希望用户能够将自动完成表单中的项目添加到某种购物清单中。我很难找到一种方法来计算和更新所有添加产品的总价格,我试图存储价格,这些价格在建议.数据中,并将其反复添加到总数中,如 总计 = 总计 + 建议数据,但这似乎不是这样。有人可以帮我制作和显示这个总数吗?我的jQuery代码如下:

var Price = {};
var Name = {};
var Totaal = {};

$(function () {
    var currencies = [
        {value:'TEXT-STRING',data:'5.50)'},
        {value:'TEXT-STRING2',data:'3.10)'},
    ];

    $('#autocomplete').autocomplete({
        lookup: currencies,
        onSelect: function (suggestion) {
            Price.fff = suggestion.data;
            Name.fff = suggestion.value;
        },   
    });
});

function addListItem() {
    var write2 = Price.fff;
    var write = $('#autocomplete').val();
    var list = $('#itemList');
    var item = $('<li><span class="list">' + write + '</span><button 
 class="delete">X</button></li>');

    var autocomplete = $("#autocomplete");

    if (write.length === 0 || write.length > 88) {
        return false;
    }

    if (write == Name.fff) {
        list.append(item);
        list2.append(item2);
        $(autocomplete).val('');
    }
    $(autocomplete).val('');

}

function deleteItem() {
    $(this).parent().remove();
}

$(function () {
    var add = $('#addItem');
    var autocomplete = $('#autocomplete');
    var list = $('#itemList');
    add.on('click', addListItem);
    list.on('click', '.delete', deleteItem);
    autocomplete.on('keypress', function (e) {
        if (e.which == 13) {
            addListItem();
        }
    }

我的 HTML 看起来像:

  <body>
    <div id="box-1"> </div>
    <div id="box-2"> </div>
    <div id="page">
      <h1>Shop</h1>
    </div>
    <div id="main">
      <div id="top">
        <div id="form">
          <div id="searchfield">
            <input type="text" id="autocomplete" name="currency" class="biginput" placeholder="ADD ITEMS BELOW">
            <input type="submit" id="addItem" value="+">
          </div>
          <div class="line"> </div>
        </div>
        <div id="bottom">
          <div class="items">
            <ul id="itemList">
            </ul>
          </div>
        </div>

【问题讨论】:

    标签: html jquery autocomplete


    【解决方案1】:

    将添加的项目与价格一起保存在数组中,以便您随时重新计算总计。从列表中删除时不要忘记将其从数组中删除。

    不要将数据保存在 DOM 中,仅使用 DOM 来显示模型中的信息。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-11-30
      • 1970-01-01
      • 1970-01-01
      • 2019-05-01
      • 2020-09-28
      • 1970-01-01
      • 2021-01-16
      • 1970-01-01
      相关资源
      最近更新 更多