我有一系列文本框,我需要将这些值相乘并在相应的范围内显示结果。 ID值都以相似的值开头,所以我试图想出一个优雅的解决方案来执行这个功能。
以下是一些示例代码:
angular.module('MyApp').factory("StoreItems", ["$firebaseObject", "$firebaseArray", "GetFireBaseObject",
function($firebaseObject, $firebaseArray, GetFireBaseObject) {
var StoreItemsRef = GetFireBaseObject.DataURL('StoreItems/');
return {
AllStores: function() {
return $firebaseObject(StoreItemsRef);
},
OneStore: function(StoreKey) {
var OneStoreRef = StoreItemsRef.child(StoreKey);
return $firebaseObject(OneStoreRef);
},
OneStoreItems: function(StoreKey) {
var OneStoreRef = StoreItemsRef.child(StoreKey);
return $firebaseArray(OneStoreRef);
}
};
}
]);
angular.module('MyApp').controller("StoreItemsCtrl", ["$scope", "StoresData", "StoreItems",
function($scope, StoresData, StoreItems) {
var StoreData = {};
$scope.StoreList = StoresData.AllStores();
$scope.SelectedStoreKey = null;
$scope.LoadStoreData = function(StoreKey) {
$scope.SelectedStore = StoresData.OneStore(StoreKey);
$scope.StoreItemData = StoreItems.OneStoreItems(StoreKey);
StoreData = StoreItems.OneStoreItems(StoreKey);
$scope.StoreItemsGrid.data = StoreData;
};
columnDefs = [
{ field: "Key", displayName: "Product Code", visible: true, groupable: false, resizable: true, sortable: true },
{ field: "UnitPrice", displayName: "Unit Price", visible: true, groupable: false, resizable: true, sortable: true, cellFilter: 'currency' },
{ field: "nForPrice", displayName: "nFor Price", visible: true, groupable: false, resizable: true, sortable: true },
{ field: "nForQuantity", displayName: "nFor Qty", visible: true, groupable: true, resizable: true, sortable: true }
];
$scope.StoreItemsGrid = {
enableSorting: true
};
$scope.StoreItemsGrid.columnDefs = columnDefs;
$scope.StoreItemsGrid.data = StoreData;
}
]);
我需要将addsys-lbs-n中的值乘以addsys-arm-n中的值,并在相关的addsys-moment-n中显示。所以我基本上在寻找以下代码的优雅解决方案:
<tr><td><input type="text" name="addsys-lru-1"/></td><td><input type="number" name="addsys-lbs-1"/></td><td><input type="number" name="addsys-arm-1"/></td><td><span id="addsys-moment-1"></span></td></tr>
<tr><td><input type="text" name="addsys-lru-2"/></td><td><input type="number" name="addsys-lbs-2"/></td><td><input type="number" name="addsys-arm-2"/></td><td><span id="addsys-moment-2"></span></td></tr>
<tr><td><input type="text" name="addsys-lru-3"/></td><td><input type="number" name="addsys-lbs-3"/></td><td><input type="number" name="addsys-arm-3"/></td><td><span id="addsys-moment-3"></span></td></tr>
其中每组addsys-lbs和addsys-arm值将显示在addsys-moment范围内。
我希望这是有道理的。谢谢你的帮助。
答案 0 :(得分:0)
使用所有类似元素的类。然后,您可以通过搜索类找到与Arm字段相同的行中的Weight字段。
$('.addsys-arm').focusout(function() {
var row = $(this).closest("tr");
var weight = row.find('.addsys-lbs').val();
var arm = $(this).val();
var sum = weight * arm;
row.find('.addsys-moment').text(sum);
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr><th>LRU</th><th>Weight</th><th>Arm</th><th>Moment</th></tr>
<tr><td><input type="text" class="addsys-lru" name="addsys-lru-1"/></td><td><input type="number" class="addsys-lbs" name="addsys-lbs-1"/></td><td><input type="number" class="addsys-arm" name="addsys-arm-1"/></td><td><span class="addsys-moment" id="addsys-moment-1"></span></td></tr>
<tr><td><input type="text" class="addsys-lru" name="addsys-lru-2"/></td><td><input type="number" class="addsys-lbs" name="addsys-lbs-2"/></td><td><input type="number" class="addsys-arm" name="addsys-arm-2"/></td><td><span class="addsys-moment" id="addsys-moment-2"></span></td></tr>
<tr><td><input type="text" class="addsys-lru" name="addsys-lru-3"/></td><td><input type="number" class="addsys-lbs" name="addsys-lbs-3"/></td><td><input type="number" class="addsys-arm" name="addsys-arm-3"/></td><td><span class="addsys-moment" id="addsys-moment-3"></span></td></tr>
</table>
&#13;