使用javascript添加文本框值

本文关键字：文本 添加 javascript 使用 | 更新日期: 2023-09-27 18:21:03

我有一个网格视图，其中包含各种文本框。我需要添加所有的文本框值，并在一个单独的文本框中显示结果。我需要使用java脚本。请帮帮我。

使用javascript添加文本框值

您的网格基本上是客户端的一个表，因此使用您的网格id访问该表，然后循环遍历其行以获取文本框值。

我不完全确定你说的是什么意思

我有一个网格视图，其中包含各种文本框。我需要补充所有文本框值，并在单独的文本框中显示结果。

当您使用网格视图时，它实际上应该以连贯的方式填充数据存储。除非您的备注指示您使用传统的网格视图文本框。

您可能需要查看淘汰赛。这个特殊的Java Script库非常强大和动态-一个例子如下：

标记：

<div data-bind='simpleGrid: gridViewModel'> </div>
<button data-bind='click: addItem'>
    Add item
</button>
<button data-bind='click: sortByName'>
    Sort by name
</button>
<button data-bind='click: jumpToFirstPage, enable: gridViewModel.currentPageIndex'>
       Jump to first page
</button>

脚本：

var initialData = [
    { name: "Well-Travelled Kitten", sales: 352, price: 75.95 },
    { name: "Speedy Coyote", sales: 89, price: 190.00 },
    { name: "Furious Lizard", sales: 152, price: 25.00 },
    { name: "Indifferent Monkey", sales: 1, price: 99.95 },
    { name: "Brooding Dragon", sales: 0, price: 6350 },
    { name: "Ingenious Tadpole", sales: 39450, price: 0.35 },
    { name: "Optimistic Snail", sales: 420, price: 1.50 }
];
var PagedGridModel = function(items) {
    this.items = ko.observableArray(items);
    this.addItem = function() {
        this.items.push({ name: "New item", sales: 0, price: 100 });
    };
    this.sortByName = function() {
        this.items.sort(function(a, b) {
            return a.name < b.name ? -1 : 1;
        });
    };
    this.jumpToFirstPage = function() {
        this.gridViewModel.currentPageIndex(0);
    };
    this.gridViewModel = new ko.simpleGrid.viewModel({
        data: this.items,
        columns: [
            { headerText: "Item Name", rowText: "name" },
            { headerText: "Sales Count", rowText: "sales" },
            { headerText: "Price", rowText: function (item) { return "$" + item.price.toFixed(2) } }
        ],
        pageSize: 4
    });
};
ko.applyBindings(new PagedGridModel(initialData));

这里有一个指向jsFiddle的链接。

这是直接来自Knockouts页面的精彩文档之一，可以在这里找到。无论如何，希望这能帮助你——你实际上可以利用这个项目的几个方面来满足你想要的目标。唯一的区别是文本框的实现，我假设它是为了修改内部网格数据。希望这能为你指明一个好的方向。

尝试这个

标记：

<table>
 <tr>
   <td>text box 1</td>
   <td><input type="text" class="textbox"  value="value1" /></td>
</tr>
<tr>
   <td>text box 2</td>
   <td><input type="text" class="textbox"  value="value2" /></td>
</tr>
<tr>
   <td>text box 3</td>
   <td><input type="text" class="textbox"  value="value3" /></td>
</tr>
<tr>
  <td>text box 4</td>
    <td><input type="text" class="textbox"  value="value4" /></td>
</tr>
<tr>
  <td>text box 5</td>
  <td><input type="text" class="textbox"  value="value5" /></td>
</tr>
<tr>
  <td>text box Final</td>
  <td><input type="text" class="textbox"  value="value5" /></td>
</tr>
</table>
<input type="text" id="final"  />

脚本：

<script type="text/javascript">
   var getp = document.getElementsByClassName('textbox');
   var temp = "";
   for(i=0;i<getp.length;i++)
     {
       temp +=getp[i].value+" ";
     }
   document.getElementById('final').value = temp
</script>
相关文章：