javascript - 在 javascript 中创建一个用于评论的模型窗口

Question

我创建了一个评论按钮。我希望当用户单击按钮时会打开模型窗口。模型窗口应该包含一个用于编写注释的键盘。

Answer 1

这可能对你有一点帮助。我们无法为您编写整个键盘的代码。

HTML:

<input type="button" value="Show the keyboard!"> <!-- the button -->
<div id="wrapper"> <!-- the keyboard -->
<!-- type your code here, make sure that it's css is like the textarea below, display:none;. Then copy-paste the jquery line which says 'textarea', and change 'textarea' to whatever element you added. -->
<textarea></textarea>
</div>

CSS:

#wrapper {
    position:relative;
    margin-top:30px;
    background-color:#CCC;
    width:400px;
    height:0px;
}

textarea {
    display:none;
    margin:0 auto;
    width:200px;
    height:160px;
}

jQuery:

$(document).ready(function() {
   $('input').click(function() { // when the button is clicked...
        $('#wrapper').animate({ height: '+=200px'},100);
        // ...increase the height of the wrapper by 200px
        $('textarea').css({ 'display': 'block'});
        // ...make sure that the textarea is visible
   })
});

JSFiddle 链接:http://jsfiddle.net/16fuhf6r/3/包含带有代码解释的注释。