jquery выбор элемента в котором значение атрибута содержит спец. символ (точку)

Question

Всем привет!

Есть Asp.net SPA приложение написанное на C#, в нем используется клиентская часть написанная на MarionetteJS. Внутри View Marionette я использую функцию которая извлекает div c помощью jquery.

html код поля ввода :

              <tr class="text-nowrap session-status">
                <td colspan="2"></td>
                <td colspan="7">
                    <div data-session-id="1234.1b40.5887" data-subscription-id="52259a4f-45dd-ea11-aaf0- 
                                                                                           005056b42cd8"></div>
                </td>
              </tr>

Если я в коде ищу элемент div так:

var element = $(".session-status div[data-session-id=1234\\.1b50\\.5887]");

то div :

 <div data-session-id="1234.1b50.5887" data-subscription-id="52259a4f-45dd-ea11-aaf0- 
                                                                                               005056b42cd8"></div>

нормально извлекается . Но мне нужно в атрибуте data-session-id убрать точки и лишь потом сделать выбор div т.к jquery такой селектор

$(".session-status div[data-session-id=1234.1b40.5887]");

не понимает и выдает ошибку из-за наличия точек их я так понял нужно экранировать слэшами. И вот когда я привожу значение атрибута в нормальный вид выбор элемента не происходит. Вот мой код :

    var id = "1234\\\\.1b40\\\\.5887";
    var selector = ".session-status div[data-session-id=" + id + "]";
    var firstsdiv=$(selector); //НЕ работает
    var secdiv =$(".session-status div[data-session-id=1234\\.1b40\\.5887]"); //Работает

ошибку выдает такую:

jquery.js:1458 Uncaught Error: Syntax error, unrecognized expression: .session-status div[data-session-id=1234\\.1b40\\.5887]
    at Function.Sizzle.error (jquery.js:1458)
    at Sizzle.tokenize (jquery.js:2075)
    at Sizzle.select (jquery.js:2479)
    at Function.Sizzle [as find] (jquery.js:855)
    at jQuery.fn.init.find (jquery.js:2695)
    at new jQuery.fn.init (jquery.js:2803)
    at jQuery (jquery.js:76)
    at child.onGetSession (request-network-services.js:314)
    at HTMLDivElement.dispatch (jquery.js:4435)
    at HTMLDivElement.elemData.handle (jquery.js:4121)

Подскажите пожалуйста в чем ошибка , вроде бы селекторы выбора одинаковые получаются , видимо jquery по своему работает с экранируемыми символами.

Видимо тут подскажут только специалисты по C# которые еще и знают JS. Потому что на jsfiddle.net код

var id ="1234\\.1b40\\.5887"; 
var elm = $(".session-status div[data-session-id="+id+"]");

Работает . Скорее всего проблема с тем что приложение размещено на IIS и он как то преобразует строки по своему

Answer 1

Поставьте кавычки:

console.log($(".session-status div[data-session-id='1234.1b40.5887']").length);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border=1>
  <tr class="text-nowrap session-status">
    <td colspan="2">TEST 1</td>
    <td colspan="7">
      <div data-session-id="1234.1b40.5887" data-subscription-id="52259a4f-45dd-ea11-aaf0-005056b42cd8">TEST 2</div>
    </td>
  </tr>
</table>

Answer 2

Рабочий селектор такой (просто добавил кавычки):

var id = "1234.1b40.5887";
var selector = ".session-status div[data-session-id='" + id + "']";

БЛОГ НА HUSL

jquery выбор элемента в котором значение атрибута содержит спец. символ (точку)

Ответы (2 шт):