0

我有一个 jQuery 函数,可以生成 QR 码并将它们输入到一个空的 IMG 标签中。该代码完美运行,唯一的问题是生成此代码需要几秒钟。所以,我基本上需要光标在函数执行时显示一个忙碌的标志,并在生成的代码被输入到空的 img 标记完成后恢复正常。

我的问题是两个方面。

问题 1

我无法让鼠标变为忙碌的标志。我尝试使用以下 CSS 代码无济于事:

$('body').css({'cursor':'wait'});

问题2

如何让代码知道二维码何时创建,然后让浏览器恢复正常?我怀疑最好的解决方法是运行检查以查看图像标签何时被输入值,然后将光标恢复正常。

我在下面附上了我的代码:

空图像标签:

<img id="qr-code-image"  src="" style="vertical-align: middle" /> 

jQuery函数:

 $('#link-types input[type=radio]').click(function() {
  $('#qr-code-image').attr('src', '');
 });

  $('#link-types input[type=radio]').click(function() {

  if (!$("input[class='link-selector-bespoke']").is(':checked')) {
   var url = $('#link-flash').text();
   $('body').css({'cursor':'wait'});
  }
  else
  {
   var url = $('#link-bespoke').text();
  }         
  var encodedvalues  = jQuery.base64Encode(url);

  var imgUrl = '<?= $this->baseUrl() ?>/scripts/qr/t/' + encodedvalues;

 $('#qr-code-image').attr('src', imgUrl);
  $('body').css({'cursor':'default'});
 });
4

1 回答 1

0

使用图片的onload事件回调函数:

$('#qr-code-image').off('load').on('load',function(){
     if(this.complete)
          $('body').css({cursor:'default'});
}).attr('src', imgUrl);
于 2013-07-18T08:57:53.010 回答