如何在HTML框中放置输入框(表单)并使用JQuery定位它

时间:2016-07-22 23:20:47

标签: javascript jquery html css

您好我有一个HTML框,并希望将输入文本框作为表单的一部分放在同一个框中。可以使用JQuery完成吗?如果是,有人可以在JQuery中发布一些代码,在框中显示输入框。我还需要调整输入框的大小。使用JQuery的原因是我正在使用JQuery显示通过MathJax呈现的数学符号。否则可以通过creat

完成
#header {
    width: 100%;
    background-color: white;
    height: 30px;
}

#container {
    width: 600px;
    height:1500px
    background-color: #ffffff;
    margin: auto;
}
#first {
    width: 100px;
    border: 2px solid black;
    float: left;
    height: 400px;
 }

#second {
    width: 300px;
    border: 2px solid black;
    top:0;
    float: right;
    height: 100px;
}

#third {
    position: absolute;
    top: 180px;
    border: 2px solid black;
    right:430px;
    width: 200px;
    height: 100px;
}
<body>
    <div id="header"></div>
    <div id="container">
    <div id="first"></div>
    <div id="second"></div>
    <div id="third"></div>
    <div id="clear"></div>
    </div>
</body>

2 个答案:

答案 0 :(得分:1)

您可以尝试:

$('#third').html('<input type="TYPE-OF-INPUT" name="INPUT-NAME" class="IF-ANY" id="IF-ANY" />')
$('#third input').css({ /*to style*/
    'prop1':'val1',
    'prop2':'val2',
    .
    .
    .
    'propn':'valn'
});

答案 1 :(得分:0)

#third {

    position: absolute;
    top: 180px;
    border: 2px solid black;
    right:430px;
    width: 200px;
    height: 100px;
}

input#foo {  
  border:  1px red solid; 
  /* position css*/
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="third">Div content</div>
timer1.Ticks