jQuery:使用正确的选择器在对象上未定义
jQuery: undefined on object with the correct selector
我在jQuery中遇到了一个问题:我有以下html代码:
<div class="side-finder">
<div class="brand"><img src="/img/test.net-logo.png" /></div>
<div class="finder-content">
<ul class="nav nav-pills nav-stacked" id="finder-menu">
<li>
<a href="#!cat/cars" class="slide-left1" data-toggle="slide-left" data-source="#sc1" data-step="1" role="button" aria-expanded="false">Autos ></a>
<ul class="hide" id="sc1">
<li>
<a href="#!cat/cars" class="slide-left2" data-toggle="slide-left" data-source="#sc1.1423423" data-step="2" role="button" aria-expanded="false">Bauteile ></a>
<ul class="hide" id="sc1.1423423">
<li><a href="#">Innenfutter</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
<li class="divider"></li>
<li><a href="#" class="btn-back1">< Zurück</a></li>
</ul>
</li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li><a href="#">Separated link</a></li>
<li class="divider"></li>
<li><a href="#" class="btn-back1">< Zurück</a></li>
</ul>
</li>
</ul>
<ul class="nav nav-pills nav-stacked hide" id="finder-child1">
</ul>
<ul class="nav nav-pills nav-stacked hide" id="finder-child2">
</ul>
</div>
这个jQuery代码:
var $finderTopObj = $('#finder-menu');
var $originalTopHtml = $finderTopObj.html();
$('.slide-left1').click(function(e) {
console.log('click 1');
var $clickedItem = $(this);
var $sourceId = $(this).attr('data-source');
console.log('step 2 ('+$sourceId+')');
$clickedItem.addClass('active');
var $sourceHtml = $($sourceId).html();
var $targetObj = $('#finder-child1');
console.log('set html to '+$targetObj.selector);
$targetObj.html($sourceHtml);
$finderTopObj.animate({
width: "50%"
}, 200, function () {
$finderTopObj.addClass('col-md-6');
$targetObj.addClass('col-md-6');
$targetObj.removeClass('hide');
console.log('done step 1------------');
$('.slide-left2').click(function(e) {
console.log('click 2');
var $clickedItem2 = $(this);
var $sourceId2 = $clickedItem2.attr('data-source');
console.log('step 2 ('+$sourceId2+')');
$clickedItem2.addClass('active');
var $sourceHtml2 = $($sourceId2).html();
console.log($sourceHtml2);
var $targetObj2 = $('#finder-child2');
console.log('set html to '+$targetObj2.selector);
$targetObj2.html($sourceHtml2);
$finderTopObj.animate({
width: "33%"
}, 200, function () {
$finderTopObj.removeClass('col-md-6');
$finderTopObj.addClass('col-md-4');
$targetObj.removeClass('col-md-6');
$targetObj.addClass('col-md-4');
$targetObj.animate({
width: "33%"
}, 200, function () {
$targetObj2.addClass('col-md-4');
$targetObj2.removeClass('hide');
console.log('done step 2------------');
});
});
});
});
});
问题是:var"$sourceHtml2"未定义,我找不到错误的代码。有人能帮忙吗?谢谢
用于测试:它基于bootstrap 3。也许这个css代码也有助于测试它
.side-finder {
font-size: 12px;
font-weight: 200;
background-color: #2e353d;
top: 0px;
width: 100%;
color: #333333;
height: 100vh;
}
.side-finder .brand {
background-color: #23282e;
line-height: 50px;
display: block;
text-align: center;
font-size: 14px;
}
.side-finder li a, .side-finder li a:hover,.side-finder li a:focus {
background-color: transparent;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
color: #cacaca;
font-weight: bold;
border-bottom: 1px solid #53585e;
}
.side-finder li a:hover {
color: #efefef;
}
.side-finder li a.active {
background-color: #3e656d;
}
.side-finder .finder-content {
overflow: auto;
height: 100%;
}
您有一个看起来像的数据属性
#sc1.1423423
记下周期,然后你做一些获取和使用变量,最后得到
$('#sc1.1423423')
请注意这是如何匹配ID为sc1
的元素和类1423423
的为了使其在jQuery中工作,必须对时段进行转义
$('#sc1''.1423423')
正确的做法是不在ID中使用句点,但如果这不是一个选项,你可以尝试将其替换为
$sourceId2 = $clickedItem2.attr('data-source').replace('.', '''.');
相关文章:
- j查询选择器不选择对象
- 在加载后创建的对象上使用 jQuery 选择器
- jQuery:使用正确的选择器在对象上未定义
- Jquery上一个对象选择器
- MVC4和日期选择器:“;0x800a01b6-JavaScript运行时错误:对象没有't支持属性或方法
- 是否有可能访问JSON对象中列出的jQuery选择器
- 如何将日期选择器日期转换为JSON对象以用于AJAX请求
- JQuery选择器找不到通过追加添加的对象
- 在javascript对象选择器中使用变量
- 如何使用jquery选择器构建具有同级标记的分层对象
- 未定义访问具有对象属性的jquery选择器
- Javascript事件对象:其中是选择器
- 在新对象参数中使用“this”选择器
- 将页面元素索引到 JSON 对象?或者jQuery选择器它每次
- Rally SDK 2 标签选择器是否有必填字段?对象没有方法'getContextPath'
- 如何获取引导时间选择器日期对象
- 将 jQuery 对象与新选择器相结合
- 尝试在选择器的迷你对象中使用 .find() 和 .children 时遇到困难
- 在自定义对象上使用 jQuery 等选择器
- 序列化表单选择器上的对象