似乎无法引用动态添加的字段

时间:2011-08-03 07:47:43

标签: javascript jquery

我有将列表项添加到无序列表的代码,并且与每个列表项关联的是用户可以单击以从列表中删除该项的按钮。这是动态发生的(即,他们从模态屏幕中选择需要添加回此无序列表的内容)。通常,item的值只是一个int。在这种情况下,我的代码一切正常。

但是如果item的值是一个字符串(因为有时候我需要处理表示为一个项目的多个id),那么remove不会做任何事情。

所以在运行时它可以像这样生成html(从firebug中抓取)

<ul id="AgencySpecialism-selected-items" class="multi-select multi-select-selector">
 <li>
<label>Spec 1/Spec 2</label>
<input id="AgencySpecialism-3|1" type="hidden" value="3|1" name="AgencySpecialism-3|1">
<button title="Clear selection" style="width: 28px;" onclick="AgencySpecialism_clear('3|1');return false;"> X </button>
</li>
</ul>

我的javascript clear功能是:

function <%= ViewData["ControlId"] %>_clear(id) {   

        <% if (Model.MultiSelectMode) { %>
        alert('#<%= Model.ControlId %>-' + id);   
        alert($('#<%= Model.ControlId %>-' + id).val());
            $('#<%= Model.ControlId %>-' + id).closest('li').remove();            
            $('#<%= Model.ControlId %>_SelectedSpecialisms').val($('#<%= Model.ControlId %>_SelectedSpecialisms').val().replace(id + ",", ""));
        <% } else { %>

首次提醒显示

#AgencySpecialism-3|1

第二次提醒显示

Undefined

所以看起来它说控件不存在 - 但是基于html标记 - 它确实......?!

所以我的最终结果是我需要这条线像它应该的那样工作:

$('#<%= Model.ControlId %>-' + id).closest('li').remove();

如果我要传入

AgencySpecialism_clear(4)

AgencySpecialism_clear('4')

然后清楚按预期工作。唯一的区别似乎是一个是管道分隔而不是单个值:(

任何想法都将不胜感激。我甚至尝试将实际渲染的id复制并粘贴到clear方法中..但它仍然认为它的val是未定义的。

编辑 - 抱歉在那里抛出.net mvc的东西 - 但问题与它的jquery部分有关:)

1 个答案:

答案 0 :(得分:2)

威廉是对的,你需要逃脱管道:

<div id="test|1">Test</div>

alert($('#test\\|1').html());

您需要这样做:

'#<%= Model.ControlId %>-' + id.replace("|", "\\|")

http://jsfiddle.net/ryyzp/1/

双反斜杠是因为你需要'\ |'在jQuery选择器中,所以你实际上是用第一个转义第二个黑色斜杠。