x-tmplとは何ですか?


86

ネットで答えを探していましたが、何も見つかりませんでした。このちょっとしたコードのスナックは、私には理解できないので、本当にイライラします。(これは、jQuery File Uploadと呼ばれるプラグインの一部です)

<script id="template-download" type="text/x-tmpl">
{% for (var i=0, file; file=o.files[i]; i++) { %}
  <tr class="template-download fade">
    {% if (file.error) { %}
        <td></td>
        <td class="name"><span>{%=file.name%}</span></td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td class="error" colspan="2"><span class="label label-important">{%=locale.fileupload.error%}</span> {%=locale.fileupload.errors[file.error] || file.error%}</td>
    {% } else { %}
        <td class="preview">{% if (file.thumbnail_url) { %}
            <a href="{%=file.url%}" title="{%=file.name%}" rel="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
        {% } %}</td>
        <td class="name">
            <a href="{%=file.url%}" title="{%=file.name%}" rel="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a>
        </td>
        <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
        <td colspan="2"></td>
    {% } %}
    <td class="delete">
        <button class="btn btn-danger" data-type="{%=file.delete_type%}" data-url="{%=file.delete_url%}">
            <i class="icon-trash icon-white"></i>
            <span>{%=locale.fileupload.destroy%}</span>
        </button>
        <input type="checkbox" name="delete" value="1">
    </td>
  </tr>
{% } %}
</script>
  • それで、どのタイプtext/x-tmplですか?
  • これら{%%}タグは何ですか?
  • どのパーサーがこのコードを実行しますか?
  • ..。

...しかし、これについてすべてを知りたいです。


私は、ファイルのある場所を送信するようちょっとあなたがアップロードしたデータを送信したのか私に言うだろう
NullPoiиteя

@Mayankswami:あなたが私に尋ねようとしていることを私は得られません。
Dyin 2012

以来、jqueryファイルのアップロードを使用していると思います。ファイルと一緒にフォームデータを送信する方法を知りたいです。
NullPoiиteя

@Mayankswami:このサイトで質問を検索する必要があると思います。探しているものが見つからない場合は、質問を作成してください。
Dyin 2012

あなたの先生aksedので、私はjqueryのファイルアップローダーでのこぎりを持って、この同じコード
NullPoiиteя

回答:


63

x-tmplには実際の意味はなく、ブラウザがスクリプトをjavascriptとして解釈するのを停止するだけです。

これは主にjqueryテンプレートまたはknockoutjsテンプレートバインディングで使用されます。

ある時点で、javascriptデータオブジェクトがテンプレートと組み合わせて使用​​され、HTMLがレンダリングされます。データオブジェクトの値は、テンプレートで{%}と同様にマークされた値を置き換え、ループなどのコードフローを反映するいくつかの{%}セクションに置き換えます。

どのテンプレートライブラリが{%}を使用しているかはわかりませんが、jqueryテンプレート、jsrender、またはノックアウトではありません。サンプルコードで参照されているライブラリを確認する必要があります。


25
ここでJavaScriptテンプレートを見つけました。スクリプトはこのサイトから参照されました。今ではすべてが理にかなっています。ブレフィングありがとうございます!
Dyin 2012

1
x-tmplを使用してHTMLをレンダリングすると、jQueryが機能しませんでした。たとえば、x-tmpl内にレンダリングするチェックボックスがあります。<label class = "modifiericon btn"> <input type = "checkbox" id = 'seo'> SEO </ label>。htmlファイル内に追加されたスクリプト。たとえば、<script type = "text / javascript"> $( '#seo')。change(function(){if($(this).is( ':checked')){alert( 'hi');} else {alert( 'hello');}} </ script>
502_Geek 2014

11

では、text / x-tmplとはどのようなタイプですか?

非標準のもの。テンプレートのように見えますが。

これらの{%および%}タグは何ですか?

テンプレート言語の一部。

どのパーサーがこのコードを実行しますか?

おそらくJavaScriptで書か<script>れ、同じページの別の要素にインポートされたものです。



-4

上記のコードは、https: //github.com/sigurdga/django-jquery-file-uploadにあるプロジェクトDjango Jquery FileUploadを参照しています。

{%%}はDjangoテンプレートタグです。詳細については、https://docs.djangoproject.com/en/dev/ref/templates/をご覧ください。

これらのタグは、djangoテンプレートシステムによって解析されます


2
これについてさらに調査を行ったところ、私の答えが間違っていることがわかりました。この場合、タグは、AJAX操作の結果に基づいてHTMLコンテンツをリアルタイムでレンダリングするメソッドとして、このJavascriptライブラリgithub.com/sigurdga/django-jquery-file-upload/blob/master/…によって使用されます。
czager 2012

7
これらのタグはDjangoテンプレートタグではありませんが、Sebastian TschanによるJavascriptテンプレートタグ:blueimp.github.com/JavaScript-Templates
Ricardo Carmo
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.