javascript - SweetAlert2检测单选按钮选择

我正在使用SweetAlert2 javascript库显示弹出窗口。 SweetAlert2是SweetAlert的分支，已不再维护。 SweetAlert2允许我添加这样的单选按钮

// inputOptions can be an object or Promise
var inputOptions = new Promise(function(resolve) {
    resolve({
      '#ff0000': 'Red',
      '#00ff00': 'Green',
      '#0000ff': 'Blue'
    });
});

swal({
  title: 'Select color',
  input: 'radio',
  inputOptions: inputOptions,
  inputValidator: function(result) {
    return new Promise(function(resolve, reject) {
      if (result) {
        resolve();
      } else {
        reject('You need to select something!');
      }
    });
  }
}).then(function(result) {
  swal({
    type: 'success',
    html: 'You selected: ' + result
  });
})

SweetAlert2将“ swal2-radio”名称命名为无线电输入，像这样

<input id="swal2-radio-1" type="radio" name="swal2-radio" value="3">

因此，我尝试听swal2-radio进行类似以下的任何点击：

$("input[name='swal2-radio']").on("click", function() {
var id = $('input[name=swal2-radio]:checked').val();
console.log('id: ' + id);
});

它应该打印到控制台，以便我知道它可以工作。

这是我到目前为止的代码：
https://jsfiddle.net/ayx0fkz3/

由于SweetAlert2的工作原理，我是在做错什么还是不起作用？

最佳答案

您必须通过委派事件绑定整个文档来绑定事件。

$(document).on("click",".swal2-container input[name='swal2-radio']", function() {
    var id = $('input[name=swal2-radio]:checked').val();
    console.log('id: ' + id);
});

检查Fiddle Link

关于javascript - SweetAlert2检测单选按钮选择，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39641241/