programing

jQuery 구문 오류: #/

iphone6s 2023. 9. 19. 20:54
반응형

jQuery 구문 오류: #/

저는 현재 jQuery, Twitter Bootstrap, Angular를 사용하고 있습니다.웹 애플리케이션에 JS.루팅을 하려고 했는데 jQuery가 계속 주네요.Syntax error, unrecognized expression: #/time시간 탭을 클릭하려고 할 때마다 또는 그 반대의 경우.이 오류의 원인은 # 기호에 의한 것 외에는 알 수 없습니다.구글 검색을 많이 해봤지만 소용이 없었습니다.여기 내 코드가 있습니다.

<ul class="nav nav-tabs">
  <li class="active">
    <a href="#/main" data-toggle="tab" id="main-tab">Main</a>
  </li>
  <li>
    <a href="#/time" data-toggle="tab" id="time-tab">Time Reports</a>
  </li>
</ul>

슬래시를 각도에 맞게 사용하기 때문에 보관해야 합니다.JS 라우팅(즉, JS 라우팅)index.html#/main그리고.index.html#/time다른 콘텐츠를 내 디브 중 하나에 로드합니다.)무엇 때문에 이런 오류가 발생할 수 있습니까?

제 생각에는 추가적인 삭감이 있을 겁니다.href지정하기id목표의제거하면 잘 될 겁니다.

<ul class="nav nav-tabs">
  <li class="active">
    <a href="#main" data-toggle="tab" id="main-tab">Main</a>
  </li>
  <li>
    <a href="#time" data-toggle="tab" id="time-tab">Time Reports</a>
  </li>
</ul>

부트스트랩은 탭 내용으로 표시될 대상 요소에 대한 href 값을 id로 봅니다.따라서 이 경우 ID가 =인 것을 찾고 있습니다.#/time존재하지 않는 것입니다.

href를 그대로 유지하려면 data-target 속성을 사용할 수 있습니다.

<a href="#/main" data-toggle="tab" data-target="#main" id="main-tab">Main</a>

데모

jquery v3.* 및 bootstrap3을 사용할 때 "#"이(가) 더 이상 유효한 선택기가 아니기 때문에 이 문제가 발생합니다(대신 href="#" 및 data-target="#" 특성을 드롭다운에 사용하여 제거하면 이 문제를 해결할 수 있습니다.다음과 같습니다.

<button data-toggle="dropdown" class="dropdown-toggle">YOUR_CODE</button>
 <ul class="dropdown-menu">
   <li><a href="javascript:void(0)" class="your-class">YOUR_TEXT</a></li>
   <li><a href="javascript:void(0)" class="your-class">YOUR_TEXT</a></li>          
 </ul>

탭의 경우 href에서 "#/""#some_your_id"로 대체하여 고정합니다.

사건이 있어요, 이 문제에 관해서는 여러 번 지난 일이에요. 그래서 여기서 제 사건을 공유하고 싶었어요.

다음과 같은 코드가 있었습니다.

   handleTabs: function () {
    //var hash = document.location.hash;
    //var prefix = "tab_";
    //if (hash) {
    //  $('.nav a[href='+hash.replace(prefix,"")+']').trigger('click');
    //}
    //// Change hash for page-reload
    //$(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
    //  window.location.hash = e.target.hash.replace("#", "#" + prefix);
    //});
},

저는 그 대사들을 생략하고 제 문제가 해결되었습니다.

이 코드와 ui.router angularJS 사이의 페이지에서 해시태그 hslash #/ 핸들링과 충돌했습니다.

이 토글링 메커니즘에서,data-toggle="tab"서로 다른 탭 간에 전환할 것으로 보입니다.그러나 Angular Routing을 사용하는 경우 이러한 링크는 다른 보기 파일로 연결됩니다.

나는 노력했다.data-toggle="link"저한테는 통했어요

언급URL : https://stackoverflow.com/questions/16785264/jquery-syntax-error

반응형