jquery对初学者的简单帮助

时间:2016-03-24 18:31:45

标签: jquery

当模糊和输入类型文本生成输入类型文本作为在输入类型文本中输入值的结果时,如何生成多个输入类型文本。使用div和label?

我的JS:

<script>
    $(document).ready(function(){
        $('#noans').blur(function(){
            var html = '<input type="text" name="noans" id="noans" class="txtbx required" />';
        });
    });
</script>

我的HTML:

<div class="fldset">
    <label for="noans">No Of Answers:</label>
    <input type="text" name="noans" id="noans" class="txtbx required" />
</div>
<div class="fldset" id="adans"></div>

2 个答案:

答案 0 :(得分:0)

表示您的输入字段想要动态生成并将其附加到由Id定位的组件下。

 $('#noans').blur(function(){
                 var html = '<input type="text" name="noans1" id="noans1" class="txtbx required" />';
                 $("#mydiv").append(html);
    });

在Html文件中

<div id="mydiv" class="fldset">
    <label for="noans">No Of Answers:</label>
    <input type="text" name="noans" id="noans" class="txtbx required" />
</div>

答案 1 :(得分:0)

首先,我建议使用&#39; change&#39;事件绑定而不是&#39; blur&#39;。完成后,您需要检查输入的值是否为有效数字。经过验证后,您可以迭代for循环(为了简单起见)并动态创建元素并将其附加到div。

$(document).ready(function(){
$('#noans').change(function(){
   if(isNaN(parseInt(this.value)))
   {
      alert("not a valid number");
      return;
   }
   var value = this.value;
   $("#adans").empty();
   $("#adans").append("<br/>");
   for(var i=1; i <= this.value; i++)
   {

     var lblele = $("<label/>",{
                  text : 'Answer ' + i
                 });
     var Inele = $("<input/>",{
                  type: 'text',
                  name: 'noans',
                  id : "noans" + i,
                  'class': 'txtbx required'
               });
         $("#adans").append(lblele);
         $("#adans").append(Inele);  
         $("#adans").append("<br/>");
   }
});
});

示例:https://jsfiddle.net/x427qn59/2/