Jquery选择带斜杠的属性

时间:2016-11-13 21:17:48

标签: javascript jquery html jquery-selectors escaping

我正在尝试通过属性值选择JQuery过滤对象,该属性是唯一的文件名。当使用var创建选择器时,我无法从斜杠中逃脱。我尝试了多种组合我失去了2个小时,但我想我错过了一些东西。提前感谢光线

我的HTML:

PATH

我的Javascript:

<table class="table table-condensed" id="CLKPMTable_2"><tbody><tr class="click-row" valuetype="PM" filename="\\server\folder\file1" paymentmethodid="1"><td class="col-md-1"><img width="24" height="24" src="/Content/img/123.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">BO OCT</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr><tr class="click-row" valuetype="PM" filename="\\server\folder\file2" paymentmethodid="2"><td class="col-md-1"><img width="24" height="24" src="/Content/img/visa.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">O SEP</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr></tbody></table>

既不适用于:

var filename = "\\server\folder\file1";
var selec = $('tr[valueType="PM"][filename="'+filename+'"]');
alert(selec.attr("paymentmethodid"));

也无法使用(来自:Jquery official doc to escape chars used in css):

var filenamescaped = filename.replace('\\','\\\\')
var selec = $('tr[valueType="PM"][filename="'+filenamescaped+'"]');

我的小提琴做一些测试: jsfiddler

1 个答案:

答案 0 :(得分:3)

在这种情况下,值的反斜杠需要加倍两倍才能成为有效的选择器

var filename = "\\\\\\\\server\\\\folder\\\\file1";
var selec = document.querySelector('tr[valueType="PM"][filename="'+filename+'"]');
alert(selec.getAttribute("paymentmethodid"));
<table class="table table-condensed" id="CLKPMTable_2"><tbody><tr class="click-row" valuetype="PM" filename="\\server\folder\file1" paymentmethodid="1"><td class="col-md-1"><img width="24" height="24" src="/Content/img/123.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">BO OCT</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr><tr class="click-row" valuetype="PM" filename="\\server\folder\file2" paymentmethodid="2"><td class="col-md-1"><img width="24" height="24" src="/Content/img/visa.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">O SEP</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr></tbody></table>

<强>更新

在您的特定情况下,filename值必须已转义才能使替换正常工作,如var filename="\\\\server\\folder\\file1"

请注意replace命令中的全局开关,以便它替换所有出现的

var filename = "\\\\server\\folder\\file1";
var filenamescaped = filename.replace(/\\/g,'\\\\\\\\');
var selec = $('tr[valueType="PM"][filename="'+filenamescaped+'"]');
alert(selec.attr("paymentmethodid"));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-condensed" id="CLKPMTable_2"><tbody><tr class="click-row" valuetype="PM" filename="\\\\server\\folder\\file1" paymentmethodid="1"><td class="col-md-1"><img width="24" height="24" src="/Content/img/123.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">BO OCT</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr><tr class="click-row" valuetype="PM" filename="\\server\folder\file2" paymentmethodid="2"><td class="col-md-1"><img width="24" height="24" src="/Content/img/visa.png" id="PMURLIMG_"></td><td class="col-md-10" id="PM_FILENAME_">O SEP</td><td class="col-md-1 text-right"><img width="16" height="16" src="/Content/img/notyet.png" id="PM_STATUS_"></td></tr></tbody></table>