Embedly的位置(JQuery)结果

Question

Embedly/Jquery非常棒。但是，我试图更改预览结果的位置，并且遇到了问题。现在，结果就出现在输入field...but下面--我宁愿把它放在页面的一个单独的部分。有办法这样做吗？

我尝试过更改选择器的位置并加载div，但这并没有帮助。它似乎忽略了这些div，并将其放在提交按钮下面。

下面是我的代码：

   <form accept-charset="UTF-8" action="private" class="new_comment" data-remote="true" id="new_comment" method="post">
   <input class="photo_comm" id="comment_comment" name="comment[comment]" placeholder="add a comment or link..." size="30" type="text" /><span type="text" id="counter">1000</span>
   <input class="btn btn-primary btn-mini" data-disable-with="Submitting..." name="commit" type="submit" value="Post" />
   </form>

   <!-- 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>

​

$('#comment_comment').preview({ key:'60f1dcdf3258476794784148a6eb65e7', // Sign up for a key: http://embed.ly/pricing
  selector : {type:'rich'},
  preview : {
    submit : function(e, data){
      e.preventDefault();
      $.ajax({
        dataType: 'script',
        url: this.form.attr('action'),
        type: 'POST',
        data: data
      });
    },
  },
  autoplay : 0,
  maxwidth : 400,
  display : {display : 'rich'}
});

​

更新

我可以在form...but中上下移动选择器()，不能将它移出表单之外，或者在选择器div和表单末尾之间放置一个。我需要将选择器移到表单之外，这就是问题所在。任何帮助都会很好。谢谢。

Answer 1

我认为您实际上必须在selector对象上设置选择器，而不是设置显示。

尝试：

...
selector : {type:'rich', selector: '#show_me'},
...

注意，选择器需要驻留在form元素中。

Answer 2

显示选项有selector选项

来自文档

显示

Create是给定对象的Feed项。

.

选择器

另一种方法是告诉create将Feed项目html放在哪里。默认值是#feed。

用你的样本：

HTML：

<div id="show_here"></div>
<form accept-charset="UTF-8" action="private" class="new_comment" data-remote="true" id="new_comment" method="post">
   <input class="photo_comm" id="comment_comment" name="comment[comment]" placeholder="add a comment or link..." size="30" type="text" /><span type="text" id="counter">1000</span>
   <input class="btn btn-primary btn-mini" data-disable-with="Submitting..." name="commit" type="submit" value="Post" />
   </form>

   <!-- 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>

联署材料：

$('#comment_comment').preview({ key:'60f1dcdf3258476794784148a6eb65e7', // Sign up for a key: http://embed.ly/pricing
  selector : {type:'rich'},
  preview : {
    submit : function(e, data){
      e.preventDefault();
      $.ajax({
        dataType: 'script',
        url: this.form.attr('action'),
        type: 'POST',
        data: data
      });
    }
  },
  autoplay : 0,
  maxwidth : 400,
  display : {display : 'rich',selector : "#show_here"}
});