Question

我收到一个jquery无法解决的ID（＆＃34;＃＆＃34; + id）.something。在文档开始时我有一个：

var g_justClicked = '';
  $.ajaxSetup({
    beforeSend:function(event){
      if(g_justClicked) {
        console.log('g_justClicked='+g_justClicked+' tagName='+$('#'+g_justClicked).tagName);
      };
      var wOffset = $('#'+g_justClicked).offset(); 
      $('#loading').show();
      },
      complete:function(){
        $('#loading').hide();
      }
     });

在文档末尾我有另一个脚本（所有带有类微调器的元素都应该设置全局变量＆＃39; g_justClicked＆＃39;）：

    $(document).ready(function () {
      $('.spinner').click(function() { 
          g_justClicked = $(this).attr('id');
          console.log('.spinner.click:  g_justClicked='+g_justClicked);
      });

这很好用，变量在ajaxSetup中正确设置和显示。

但是：在tagName =或wOffset = with

中引用它

$('#'+g_justClicked).

结果＆＃34; TypeError：wOffset / tagName未定义＆＃34;

注意：所有ID都以几个字符开头，t.e。＆＃34; boxshow12345＆＃34;是一个典型的身份。

我做错了什么？

Answer 1

我认为能够在此处重现您的方案：https://jsfiddle.net/mrlew/qvvnjjxn/3/

undefined中的console.log是因为您正在访问不存在的jQuery属性：.tagName。此属性仅适用于原生HTML Element。

要从jQuery对象中检索标记名称，您应该使用：.prop("tagName")，或访问使用$('#'+g_justClicked)[0].tagName访问本机元素的属性

所以，如果你改变了

console.log('g_justClicked='+g_justClicked+' tagName='+$('#'+g_justClicked).tagName);

为：

console.log('g_justClicked='+g_justClicked+' tagName='+$('#'+g_justClicked).prop("tagName"));

将按预期成功记录：g_justClicked=boxshow12345 tagName=BUTTON。

注意：为了您的逻辑工作，您必须先点击.spinner。

Answer 2

您的问题是，无论您在click处理程序中执行什么操作，您的ajax设置都会运行，并且在您设置该处理程序之前运行它。 g_justClicked的初始值为空字符串，这是它尝试在$('#'+g_justClicked)中访问的内容，因此出现错误。

如果您想点击微调器然后将ID传递给beforeSend，请执行以下操作：

$(document).ready(function() {
    $('.spinner').click(function() {
        var g_justClicked = this.id;  //simplify this a bit
        console.log('.spinner.click:  g_justClicked=' + g_justClicked);
        // call ajax
        _setupAjax( g_justClicked );
    });
});

function _setupAjax(g_justClicked) {
    $.ajaxSetup({
        beforeSend: function(event) {
            if (g_justClicked) {
                console.log('g_justClicked=' + g_justClicked + ' tagName=' + $('#' + g_justClicked).tagName);
            };
            var wOffset = $('#' + g_justClicked).offset();
            $('#loading').show();
        },
        complete: function() {
            $('#loading').hide();
        }
    });
}

<强>更新

如果您不想要单独的功能，只需将您的ajax设置移动到点击处理程序中：

$(document).ready(function() {
    $('.spinner').click(function() {
        var g_justClicked = this.id;  //simplify this a bit
        console.log('.spinner.click:  g_justClicked=' + g_justClicked);

        // call ajax setup
        $.ajaxSetup({
            beforeSend: function(event) {
                if (g_justClicked) {
                    console.log('g_justClicked=' + g_justClicked + ' tagName=' + $('#' + g_justClicked).tagName);
                };
                var wOffset = $('#' + g_justClicked).offset();
                $('#loading').show();
            },
            complete: function() {
                $('#loading').hide();
            }
        });
    });
});

Answer 3

好的@mrlew。答：我尝试了你的.prop appoach，但仍然没有定义＆＃34;。现在回到根源：目标是获取被点击的任何元素的id以修改忙指示符位置，同时ajax正在运行。新的我回到原来的方法，没有全局变量和参数传递：

$(document).ready(function () {
  $('.spinner').click(function() { 
    _setupAjax();
    });
});

有效，并且：

function _setupAjax() {
    $.ajaxSetup({
        beforeSend: function() {
           $('#loading').show();
           wJustClicked = $(this).attr('id');   ///  <- that doesnt work!
           console.log("_setupAjax  wJustClicked="+wJustClicked);
           console.log('_setupAjax  tagName=' + $('#' + wJustClicked).prop("tagName"));
           ....defining css based on id (no problem)..

产生＆＃34; undefined＆＃34;两次。我尝试了很多方法来获得那个.... id。

Answer 4

@mrlew 非常感谢你的帮助。同时我找到了解决方案。所有问题都来自计时问题。这是有用的（对于所有DIV，SPAN和IMG的class = spinner并且有一个id：

$(document).ready(function () {
  _setupAjax();
  $('.spinner').click(function() { 
      wJustClicked = $(this).attr('id'); 
      if(wJustClicked == null) alert('Id missing on item clicked');
      console.log('.spinner.click!  id='+wJustClicked);
      var wOffset = $('#' + wJustClicked).offset();
      var xPos = Math.round(wOffset.left) + 8;
      var yPos = Math.round(wOffset.top) + 4;
      console.log(wJustClicked+' offset  left='+wOffset.left+' top='+wOffset.top+' xPos='+xPos+' yPos='+yPos);
      wDiv = 'loading';
      $('#'+wDiv).css('left',xPos);
      $('#'+wDiv).css('top',yPos);
  });

和js函数：

function _setupAjax() {
    $.ajaxSetup({
        beforeSend: function() {
            $('#loading').show();
        },
        complete: function() {
            $('#loading').hide();
        }
    });
}

还有一件奇怪的事情（我安装了firebug），我用Math.round解决了这个问题：x和y位置超过了170.5134577和434.8768664？！？我可以忍受这一点。但这种伪精度来自哪里？再次感谢你让我的希望保持正直。

jquery类选择器产生不可用的id

4 个答案: