Javascript onchange(this.value，this.value）在ipad上不起作用 - Javascript onchange(this.value, that.value) not working on ipad

我有这个代码，它在PC上运行得很好，但在我的iPad上不起作用（我想它在任何手机上也不起作用）。我尝试过Safari和Chrome浏览器，但没有任何运气。

HTML：

<input name="Service" type="radio" value="110" onchange="update_cart(this.value, Service2.value )" />
<input name="Service" type="radio" value="111" onchange="update_cart(this.value, Service2.value )" />
<input name="Service2" type="radio" value="112" onchange="update_cart(Service.value, this.value)" />
<input name="Service2" type="radio" value="113" onchange="update_cart(Service.value, this.value)" />

JavaScript：

function update_cart(radio1,radio2) {
    if (Service == "" || ID_Service == "") {
        document.getElementById("Cart").innerHTML = "";
        return;
    }
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        update = new XMLHttpRequest();
    } else { // code for IE6, IE5
        update = new ActiveXObject("Microsoft.XMLHTTP");
    }
    update.onreadystatechange = function() {
        if (update.readyState == 4 && update.status == 200) {
            document.getElementById("Cart").innerHTML = update.responseText;//fills Cart div with result
        }
    }
    update.open("GET", "/new/update_cart.php?radio1=" + radio1 + "&radio2=" + radio2, true);
    update.send();
}

我知道问题就在这里，因为函数update_cart只是接收具有"this.value"的变量，而不是另一个，例如：当点击/点击第一个单选按钮时，函数接收（110，未定义），反之亦然，第二个单选按钮（未定义，112）

我的问题是：我在这里做错了什么吗？这不应该在手机上工作吗？有什么解决办法吗？

编辑：现在我们有4个选项，我们的想法是能够用你检查的新项目更新购物车，每次你点击另一个收音机时，它都应该更新购物车。

永远不要使用内联JS（比如HTML中的onchange），除非你使用的是像Angular这样有意义的框架。否则，它是有限的、丑陋的，而且可能有缺陷。

您可以使用库或框架使其更轻、更干净。Racive、Angular、React等都有很大帮助。

有关说明，请参见代码注释。

// get element references
var serviceElems = document.querySelectorAll('[name="Service"]');
var service2Elems = document.querySelectorAll('[name="Service2"]');
// loop through both sets of references and attach "change" listeners
[serviceElems, service2Elems].forEach(function(set) {
  [].forEach.call(set, function(elem) {
    elem.addEventListener('change', myFn);
  });
});
// this is fired when any of the elements are clicked
function myFn() {
  // loop over the sets of elements, mapping values back to `vals`
  var vals = [serviceElems, service2Elems].map(function(set) {
    // find the checked element (if any) from this set
    var checkedElem = [].find.call(set, function(elem) {
      return elem.checked;
    });
    // if one was checked, return its value (maps to vals)
    if (checkedElem) { return checkedElem.value; }
  });
  updateCart(vals[0], vals[1]);
}
var result = document.getElementById('result');
function updateCart(radio1, radio2) {
  result.textContent = 'Service: '+radio1+' Service2: '+radio2;
}
// SHIM FOR ES6 [].find
if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;
    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

<h3>Set 1</h3>
<label>110</label>
<input name="Service" type="radio" value="110">
<label>111</label>
<input name="Service" type="radio" value="111">
<h3>Set 2</h3>
<label>112</label>
<input name="Service2" type="radio" value="112">
<label>113</label>
<input name="Service2" type="radio" value="113">
<h3>Result</h3>
<div id="result"></div>

请在AngularJS中查看。使用Angular，我们鼓励您在HTML中使用逻辑。除了函数调用updateCart之外，这不需要任何直接的js。

angular.module('myApp', [])
.controller('myCtrl', function($scope) {
  $scope.updateCart = function(radios) {
    console.log.apply(console, radios);
  };
})
;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl" ng-init="sets = [[110, 111], [112, 113]]; models = []">
  <div ng-repeat="set in sets">
    <h3>Set {{$index+1}}</h3>
    <div ng-repeat="item in set">
      <label>{{item}}</label>
      <input name="Service" type="radio" ng-value="item" ng-model="models[$parent.$index]" ng-change="updateCart(models)">
    </div>
  </div>
  <div id="result">
    <p ng-repeat="model in models">Model {{$index+1}}: {{model}}</p>
  </div>
</div>