div jquery不会出现在javascript中

时间:2013-11-13 15:27:58

标签: javascript jquery html html5

我正在尝试使用此代码创建一个mcq问题

<div data-role="content">
        <form name="newdocument">

            <div id="questions" data-role="fieldcontain"><input type="text" value="dsa"/></div>
            <input type="button" value="Add Question" onclick="AddQuestion();" />

        </form>
    </div>

值为dsa的文本框与使用fieldcontain的jquery正常工作。但是当我按下按钮使用下面的代码添加问题时

<script type="text/javascript">
                var questionNum = 1;//question number
                //function to add question

                function AddQuestion(){
                    document.getElementById('questions').innerHTML+=

                    "<div id='question"+questionNum+"'>"+
                    "<div data-role='fieldcontain'>"+
                    "Q"+questionNum+"."+
                    "<input type='text' id='questionText"+questionNum+"' placeholder='Put your question here' data-mini='true'/>"+
                    "<input type='button' id='"+questionNum+"' name='1' value='Add Option' onclick='AddOption(this);' />"+
                    "<div id='optionList"+questionNum+"'"+
                    "</br>"+
                    "<input type='radio' id='question"+questionNum+"option0' name='radio' onclick='DisableCheck(this);' />"+
                    "<input type='text' id='question"+questionNum+"option0text' placeholder='Option 1' data-mini='true' />"+
                    "</br>" +
                    "</div>" + 
                    "</div>" +
                    "</br>";
                    questionNum++;
                }

                function AddOption(element){
                    var buttonName = element.getAttribute("name");//define unique question
                    var buttonId = element.getAttribute("id");//define unique choice
                    //ex: id=question1option1 for question 1 choice A 
                    if(buttonName<5){
                        buttonName++;
                        document.getElementById('optionList'+buttonId).innerHTML+=
                        "<input type='radio' id='question"+buttonId+"option"+buttonName+"' name='radio' onclick='DisableCheck(this);' />"+
                        "<input type='text' id='question"+buttonId+"option"+buttonName+"text' placeholder='Option "+buttonName+"' data-mini='true'/>"+
                        "</br>";
                        element.name = buttonName;
                    } else {
                        buttonName = 1;
                        document.getElementById('optionList'+buttonId).innerHTML=
                        "<input type='radio' id='question"+buttonId+"option"+buttonName+"' name='radio' onclick='DisableCheck(this);' />"+
                        "<input type='text' id='question"+buttonId+"option"+buttonName+"text' placeholder='Option "+buttonName+"' data-mini='true'/>"+
                        "</br>";
                        element.name = buttonName;
                    }

                }

                function DisableCheck(element){
                    element.checked = false;
                }

    </script>

由addquestion函数创建的文本框与在表单上创建的文本框不同。谁能告诉我为什么它不起作用?

0 个答案:

没有答案