jquery 템플릿에서 호출 된 함수에 마크 업 포함?

jQuery UI Autocomplete 플러그인에서 jQuery Templates를 사용하여 자동 완성 결과가 어떻게 렌더링되는지보다 잘 제어 할 수 있습니다. 내가하고 싶은 것은 결과 내에서 입력을 강조하는 것입니다. http://jqueryui.com/demos/autocomplete/combobox.html은 제가 달성하고자하는 좋은 예입니다. jQuery 템플릿을 사용하고 싶습니다.jquery 템플릿에서 호출 된 함수에 마크 업 포함?

는 여기에 지금까지 (자동 완성 코드의 일부와 함께 밖으로 추출)이 작업은 다음과 같습니다

<script> 
    // in this example, this.term == 'dog' 
    $('#tmplProject').tmpl({text: "All About Dogs"}, 
    {term: this.term, highlight: function(text) { 
     return text.replace(new RegExp(
        "(?![^&;]+;)(?!<[^<>]*)(" + 
        $.ui.autocomplete.escapeRegex(this.term) + 
        ")(?![^<>]*>)(?![^&;]+;)", "gi" 
       ), "<strong>$1</strong>"); 
    }})) 
</script> 
<script id="tmplProject" type="text/x-jquery-tmpl"> 
    some other markup goes here. ${$item.highlight(name)} 
</script>

문제가가의 <strong> 요소가 탈출지고 있으며, All about <strong>Dog</strong>s는 브라우저에 표시됩니다. 템플릿은 강조 표시 방법이 아니라 마크 업이 있어야하기 때문에 이러한 종류의 의미가 있습니다. 그렇다면 강조 표시 방법의 논리를 생성되는 마크 업과 어떻게 분리합니까?

출처

2011-02-11 carpeliam

{{html}} 태그가 작동합니까? 이처럼

<script id="tmplProject" type="text/x-jquery-tmpl"> 
    some other markup goes here. {{html $item.highlight(name) }} 
</script>

: http://jsfiddle.net/rniemeyer/baY3k/

출처

2011-02-11 17:27:37

덕분에, 나는 문서에서이 곳을 놓친해야합니다. 이 예제는 완벽하게 작동하지만, 하이라이트 메서드 자체보다는 템플릿에 마크 업을 유지하는 방법이 궁금합니다. – carpeliam

텍스트를 (정규 표현식 또는 분할 표현식을 사용하여) 접두사, 텍스트 및 접미어와 같은 세 개의 객체로 분리하는 방법은 어떻습니까? 그런 다음 템플릿을 다음과 같이 표시하십시오. $ {prefix} $ {text} $ {suffix} –

jquery 템플릿에서 호출 된 함수에 마크 업 포함?

답변

관련 문제