我被社交媒体分享按钮困住了。我想传递链接,从一个视图(一个href标签)到另一个视图,有一个带有社交网络按钮的模态div。更具体地说,我有一个名为/ posts的页面,其中显示了许多帖子,并在每个卷轴上按js加载。所以这些帖子在标签上有唯一的ID。所以我希望得到以下结果:将该视图中的href传递到另一个视图,当用户单击同时返回带有社交网络按钮的模式的按钮时调用该视图。最后应该将href传递给那些按钮。 在这种情况下,每次用户点击共享按钮时,模式都会打开。这些按钮应该在社交网络上发布特定帖子href链接。
下面是每个帖子标题上的分享按钮图片 显示在页面中。
<a data-href="/posts/{{$post->id}}" data-toggle="modal" data-target="#myModal">
在由onClick函数调用的模式弹出窗口之后,在js中显示社交按钮。
<div class="modal-body">
<div class="col-md-6">
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share facebook" role="button"><i class="fa fa-facebook" aria-hidden="true"></i>
Facebook</a>
</div>
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share google" role="button"><i class="fa fa-google-plus" aria-hidden="true"></i>
Google+</a>
</div>
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share pinterest" role="button"><i class="fa fa-pinterest" aria-hidden="true"></i>
Pinterest</a>
</div>
</div>
<div class="col-md-6 last">
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share viber" role="button"><img style="margin-top: -3px;" src="../fonts/viber1400.png"></i>
Viber</a>
</div>
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share tumblr" role="button"><i class="fa fa-tumblr" aria-hidden="true"></i>
Tumblr</a>
</div>
<div class="col-md-12 btn-list">
<a href="#" class="btn btn-primary btn-share twitter" role="button"><i class="fa fa-twitter" aria-hidden="true"></i>
Twitter</a>
</div>
</div>
</div>
答案 0 :(得分:0)
在这种情况下,您需要从远程URL调用引导程序模型。例如:
/帖子页
<!DOCTYPE html>
<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"></script>
<ul class="nav navbar-nav" id="menu">
<li><a href="/posts/modal/{{$post->id}}" data-toggle="modal" data-target="#myModal">Edit/Delete</a>
</li>
</ul>
<div id="myModal" class="modal fade text-center">
<div class="modal-dialog">
<div class="modal-content">
</div>
</div>
</div>
</body>
</html>
模态内容的远程laravel视图:
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<!-- get the post details by using the post id that is passed in url -->
<p>Social media to this post</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
要生成社交链接,您可以使用social link generator,这非常有用。