Question

我想从表单输入更新facebook like框。单击检查按钮后。新的相似框将出现在div中。

HTML

<input type="text" class="form-control" placeholder="facebook Page URL" 
id="fbURL" value="cnn">             

<button class="btn btn-primary" type="button" id="fbChk">check</button>

的Javascript

$('#fbPage').append('<div id="fb-like" class="fb-like-box" 
data-href="http://www.facebook.com/RTnews" 
data-width="500" data-show-faces="true" 
data-stream="false" data-header="true"></div>');

    $("#fbChk").click(function() {
        var fbURL = $("#fbURL").val(); 
        $('#fbPage').html('<div id="fb-like" class="fb-like-box" 
         data-href="http://www.facebook.com/'+fbURL+'" 
         data-width="500" data-show-faces="true" 
         data-stream="false" data-header="true"></div>');
      });

当我运行此脚本时。老脸盒在没有新的节目的情况下消失。

Answer 1

这很容易用像反应这样的前端框架来完成，但在jQuery中我看到两个选择，当你点击按钮$.hide()第一个div和$.append()第二个div或者你可以显示第二个div并给予道具display: none。当您点击该按钮时，您可以使用$.show()显示第二个div，并隐藏第一个..或者尝试使用innerHTML()代替$.html()。

使用jquery更新fb-like-box onclick

1 个答案: