Question

我想要有实时预览功能。任何人都可以给我代码。我正在使用bootstrap进行样式设计。我试图使用keyup（）进行实时预览我不明白它有什么问题。

<div class="control-group">
    <label class="control-label" for="question">Question</label>
        <div class="controls">
            <input class="input-xxlarge" type="text" name="question" id="question" required="true" placeholder="write your question"><span class="preview"></span>
        </div>
    </div>

这是我的实时预览jquery。

<script type="text/javascript">
         /* <![CDATA[ */

        $('.input-xxlarge').keyup(function(){
            var input-xxlarge = $(this).val();
            $("preview").html(input-xxlarge);
            {return false;}
        });

    /* ]]> */
</script>

Answer 1

我建议您使用id代替class来完成这项工作。

<div class="control-group">
    <label class="control-label" for="question">Question</label>
    <div class="controls">
        <input class="input-xxlarge" type="text" name="question" id="question"
        required="true" placeholder="write your question" /> <span class="preview"></span>

    </div>
</div>

和

$('.input-xxlarge').keyup(function () {
    var impt = $(this).val();
    $(".preview").html(impt);
});

工作得很好。这是fiddle的链接。

Answer 2

你不应该使用“ - ”作为变量名

$(document).ready(function(){
      $('.input-xxlarge').keyup(function(){
            var inputxxlarge = $(this).val();
            $(".preview").html(inputxxlarge);
            {return false;}
        });

});

Answer 3

试试这个你想要的确切吗？

http://jsfiddle.net/8ajQF/2

$(document).ready(function(){
  $("input").keypress(function(){
     var sac = $(this).val();
    $("span").text(sac);
  });
});

我该如何进行实时预览？

3 个答案: