0

外部json/templateを呼び出すjqueryウィジェット内で口ひげを使用しています。私のJqueryは問題ないようです。ただし、mutstache でエラーが発生します。スクリプトは次のとおりです。

TypeError: this.tail.search は関数ではありません
[このエラーで中断]

var match, pos = this.tail.search(re);

(function() {

// Localize jQuery variable
var jQuery;

/******** Load LAB Js *********/

    var script_tag = document.createElement('script');
    script_tag.setAttribute("type","text/javascript");
    script_tag.setAttribute("src",
        "js/LAB.min.js");//local
    if (script_tag.readyState) {
      script_tag.onreadystatechange = function () { // For old versions of IE
          if (this.readyState == 'complete' || this.readyState == 'loaded') {
              scriptLoadHandler();
          }
      };
    } else { // Other browsers
      script_tag.onload = scriptLoadHandler;
    }
    // Try to find the head, otherwise default to the documentElement
    (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);

/******** Load js as required ******/
function scriptLoadHandler() {
    var labjs = $LAB
    .script('http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js').wait()
    .script('js/mustache.js').wait();//local
    labjs.wait(function(){
        main();
    });  
}

/******** main function ********/
function main() { 
    jQuery = window.jQuery.noConflict(true);

    jQuery(document).ready(function($) {

        function jsonHandler(data){
            $.get('templates/template.html',function(template){
                console.log(data);
                console.log(template);
                var htmlRenderer = Mustache.to_html(template,data);
            });
        }

        $.getJSON('json/data.json',jsonHandler);                




    });
   //alert('end');
}//main() done

})();//function done
4

3 に答える 3

1

jquery 1.8.xでも同じ問題が発生しました。html-template を html オブジェクトではなく文字列としてレンダリングすることで解決しました。dataType: 'text' を使用すると、テンプレートの html コンテンツを含むクリーンな文字列が得られます。レンダリングエンジンはそれでうまく動作します。
テスト済み: firefox と chrome

$.ajax({
        type: 'GET',
        url: './htmlTemplates/conferenceMembers.htpl',
        dataType: 'text',
        success: function (data) {
            $(divId).append(Mustache.render(data, htmlRenderValues));
        }
    });

注: この問題は jquery 2.0.1 で解消されました。html オブジェクトのレンダリングが機能します。

于 2013-05-31T08:07:18.907 に答える
0

このエラーは Firefox で発生していましたが、奇妙なことに Chrome では発生しませんでした。False実行時のテンプレートデータが原因であることがわかりましたmustache.render()

プロジェクトには、テンプレートがロードされたときに他のコンポーネントがチェックできるように苦労した後に見つけた、他の誰かによって書かれたこれに対応するコードが既にあったことがわかりました。

htmltemplate.js:

function HTMLTemplate(location)
{
    this.template = null;
    var self = this;
    $.get(staticURL+location, function(data)
    {
        self.template = data;
    });

}

HTMLTemplate.prototype.getTemplate = function()
{
    if(this.template)
    {
        return this.template
    }
    else
    {
        return false;
    }
}

mediabootstrap.js:

var MediaBootstrap = {};
MediaBootstrap.templates = {};
MediaBootstrap.init = function()
{
    this.templates.mytemplate = new HTMLTemplate('js/templates/mytemplate.html');
}

MediaBootstrap.templatesLoaded = function()
{
    var loaded = true;
    for(key in this.templates)
    {
        if(!this.templates[key].getTemplate())
        {
            loaded = false;
            break;
        }
    }
    return loaded;
}

myobject.js:

MyObject.buildOptions = function(data)
{
    if(!MediaBootstrap.templatesLoaded())
    {
        setTimeout(function(){
            MyObject.buildOptions(data);
        }, 100);
        return;
    }
    var tpl = MediaBootstrap.templates.mytemplate.getTemplate();
    var html = Mustache.render(tpl, data);
    this.element.find('div.container').html(html);
}
于 2013-04-16T10:18:03.283 に答える