Question

我有一组带有元素（输入）的HTML表单。

那么，如何检测任何输入中的更改并在对象var data中设置新语句？

例如：

<input type="text" name="parameter" value="30">

当我在输入中创建chnages时，我需要将输出对象data作为：

var = data = ["paraeter" : 30];

Answer 1

要观察角度变化的值，您应该使用ng-change和ng-model

＆＃13;

var app = angular.module("app", []).
controller("ctrl", function($scope) {
  $scope.info = {
    parameter: 30,
    parameters: {
      children: 40
    }
  };
  
  $scope.callBackIfChange = function(){
    console.log($scope.info); 
  }

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">

  <form>
    <label>empty value</label>
    <input type="text" ng-model="info.name" ng-change="callBackIfChange()">
    <br>
    <br>
    <label>has default value</label>
    <input type="number" ng-model="info.parameter" ng-change="callBackIfChange()">
    <br>
    <br>
    <label>nested</label>
    <input type="number" ng-model="info.parameters.children" ng-change="callBackIfChange()">
  </form>
   <hr>
  <b>output:</b> {{info | json}}
 
</div>

＆＃13;

Answer 2

以下是涵盖您的案例的Jquery代码（onload和输入更改）没有硬编码输入标记的名称属性：

var inputValuesObj = {}; // << Your Object

$(document).ready(function() {
    getDefaultInputValues();
});

$(document).on("load keyup", "input", function() {
    getDefaultInputValues();
});

function getDefaultInputValues() {
    $("input").each(function(index) {
        inputValuesObj[$(this).attr("name")] = $(this).val();
    });
    $("div#res").html(JSON.stringify(inputValuesObj));
}

您的考试 - https://jsfiddle.net/uo08fedh/20/

希望它有所帮助！

如何检测表单中的更改并设置新状态？

2 个答案: