我想在甜蜜提示中单击我的按钮时加载一些功能

时间:2019-04-11 05:55:15

标签: javascript sweetalert

我想在单击我的按钮时加载shome功能。我有下面写的代码。请看一看。当我在ConfirmButton上单击它时,它可以工作,但是当我单击按钮时,我需要加载该功能。

'onClick' => "swal({
                    title: 'Scan Qr Code',
                    text: '<video id=\"preview\" width=\"100%\"></video><audio id=\"buzzer\" src=\"../beep.ogg\" type=\"audio/ogg\"></audio>',
                    html: true,
                    showCancelButton:true,
                    showConfirmButton:true,
                    allowOutsideClick:true,
                    cancelButtonText: 'Cancel',
                    confirmButtonText: 'Scan',
                    closeOnConfirm: false 
                  }, function(){                                                                                 
                      let scanner = new Instascan.Scanner({ video: document.getElementById('preview') });
                      scanner.addListener('scan', function (content) {
                        $('#buzzer').get(0).play();
                        alert(content);
                      });
                      Instascan.Camera.getCameras().then(function (cameras) {
                        if (cameras.length > 0) {
                          scanner.start(cameras[0]);
                        } else {
                          console.error('No cameras found.');
                        }
                      }).catch(function (e) {
                        console.error(e);
                      });
                  });

2 个答案:

答案 0 :(得分:0)

在按钮上单击,使用jquery检查您的sweetalert是否准备就绪并执行功能。

'onClick' => "swal({
                title: 'Scan Qr Code',
                text: '<video id=\"preview\" width=\"100%\"></video><audio id=\"buzzer\" src=\"../beep.ogg\" type=\"audio/ogg\"></audio>',
                html: true,
                showCancelButton:true,
                showConfirmButton:true,
                allowOutsideClick:true,
                cancelButtonText: 'Cancel',
                confirmButtonText: 'Scan',
                closeOnConfirm: false 
              });
$('#preview').ready(function(){                                                                                 
                  let scanner = new Instascan.Scanner({ video: document.getElementById('preview') });
                  scanner.addListener('scan', function (content) {
                    $('#buzzer').get(0).play();
                    alert(content);
                  });
                  Instascan.Camera.getCameras().then(function (cameras) {
                    if (cameras.length > 0) {
                      scanner.start(cameras[0]);
                    } else {
                      console.error('No cameras found.');
                    }
                  }).catch(function (e) {
                    console.error(e);
                  });
              })

答案 1 :(得分:0)

                 'onClick' => "swal({   
                    title: 'Scan Qr Code',
                    text: '<video id=\"preview\" width=\"100%\"></video><audio id=\"buzzer\" src=\"../beep.ogg\" type=\"audio/ogg\"></audio>',
                    html: true,
                    showCancelButton:true,
                    showConfirmButton:true,
                    allowOutsideClick:true,
                    cancelButtonText: 'Cancel',
                    confirmButtonText: 'Scan',
                    closeOnConfirm: false 
                    }, function(){                                                                                 
                        let scanner = new Instascan.Scanner({ video: document.getElementById('preview') });
                        scanner.addListener('scan', function (content) {
                            $('#buzzer').get(0).play();
                            if (content.indexOf('http://') == 0 || content.indexOf('https://') == 0) {
                                return swal('Opps!!!', 'Wrong QR Code', 'error');
                            }else{
                                window.location = '/qr-search/'+content;
                            }
                        });
                        Instascan.Camera.getCameras().then(function (cameras) {
                          if (cameras.length > 0) {
                            scanner.start(cameras[0]);
                          } else {
                            console.error('No cameras found.');
                          }
                        }).catch(function (e) {
                          console.error(e);
                        });
                    });