0

我正在尝试从嵌入回调中提取特定变量。现在表单可以工作，并生成预览。但是，不能调用任何单个变量。

在我看来，这是我原来的嵌入代码：

<div class="container">
   <div class="row">
      <div class="span10 columns offset3">
          <h3>Share a link</h3>
          <form id="preview_form" class="form-vertical" method="post" action=".">
            <fieldset>
            <div class="clearfix">
                <label for="url">URL</label>
                <input type="text" class="input-xxlarge" name="url" id="id_url" />
                <span class="help-block">Enter a url.</span>
            </div>
            </fieldset>
            <!-- Placeholder that tells Preview where to put the loading icon-->
            <div class="loading">
              <img src='http://embedly.github.com/jquery-preview/images/loading-rectangle.gif'>
            </div>
            <!-- Placeholder that tells Preview where to put the selector-->
            <div class="selector"></div>

            <div class="actions">
              <input id="id_submit" type="submit" class="btn btn-primary" value="Post"/>
            </div>

          </form>
        </div>
      </div>
      <div class="row">
        <div id="feed" class="span10 columns offset3">

        </div>
      </div>
      <div class="clear"></div>
</div>
<script>
      var preview = {
        submit : function(e, data){
          e.preventDefault();
          this.display.create(data);
        }
      }
      $('#id_url').preview({key:'my_key',
                            preview:preview,
                            selector : {type:'rich'},
                            maxwidth : 500,
                            display : {display : 'rich'}});
</script>

它工作得很好。但是，我想将各个变量放入模板（下面是模板）。关于如何执行此操作或拉入视图的任何建议？现在 {{title}} 显示为 {{title}} 而不是实际的标题，以及所有其他变量。

<div id="selector" class="small">
   <div class="thumbnail">
      <div class="controls">
          <a class="left" href="#">&#9664;</a>
          <a class="right" href="#">&#9654;</a>
          <a class="nothumb" href="#">&#10005;</a>
      </div>
      <div class="items">
          <ul class="images">
            {{#images}}
            <li><img src="{{url}}"/></li>
            {{/images}}
          </ul>
      </div>
    </div>
      <div class="attributes">
        <a class="title" href="#">{{title}}</a>
        <p><a class="description" href="#">{{description}}</a></p>
        <span class="meta">
          <img class="favicon" src="{{favicon_url}}">
          <a class="provider" href="{{provider_url}}">{{provider_display}}</a>
        </span>
      </div>
      <div class="action"><a href="#" class="close">&#10005;</a></div>
 </div>
4

1 回答 1

0 
  $('#id_url').preview({key:'my_key',
                        preview:preview,
                        selector : {type:'rich'},
                        maxwidth : 500,
                        display : {display : 'rich'}}
                        success : function(oembed){
                                  oembed.title // gives you title
                                  oembed.description // gives you description 
                                  });

您可以使用它们并按照您想要的方式设置它们的样式。但这将覆盖默认的嵌入样式。

于 2012-10-15T10:36:49.807 回答