JS dynamic addition option case analysis, js dynamic Case Analysis

JS dynamic addition option case analysis, js dynamic Case Analysis

This article analyzes how to add options dynamically in JS. We will share this with you for your reference. The details are as follows:

I. Problems:

The number of questions and answers of a questionnaire is not fixed.

JS control answer

II. Implementation Method:

To achieve this effect, click the button to add 4 answer boxes below, select the 26 letters from the A-Z, is to facilitate the processing of ASSIC code

View HTML results

<Table width = "100%" class = "form"> <tr> <th width = "100px"> <label> Title 1: </label> </th> <td align = "left"> <input type = "text" class = "large" id = "title" name = "title"/> <span class = "error"> enter the title </span> </td> </tr> <th width = "100px"> <label> select a type: </label> </th> <td align = "left"> <input type = "radio" name = "radio"/> Single-choice <input type = "radio" name = "boxcheck"/> select multiple <input type = "radio" name = "select"/> drop-down list </td> </tr> <th width = "100px"> <label> answer: </label> </th> <td align = "left"> <div style = "float: left;" id = "1">: <input type = "text" class = "mimi" name = "A"/> B: <input type = "text" class = "mimi" name = "B"/> C: <input type = "text" class = "mimi" name = "C"/> D: <input type = "text" class = "mimi" name = "D"/> </div> <div class = "more" onclick = "add_ask ($ (this )) "> </div> </td> </tr> </table>

The above HTML result is then implemented through JS

Function add_ask ($ this) {var $ Word = ""; // obtain the front div layer var $ div_num = $ this. prev (). children (). attr ("id"); // Add layer var $ div_next_num = Number ($ div_num) + 1; var $ last_children_name = $ this. prev (). children (). last (). children (). last (). attr ("name "). charCodeAt (); var $ html = "<div style = \" float: left; \ "id =" + $ div_next_num + "> "; // perform four cycles if ($ last_children_name + 4 <= 90) {for (var $ I = 1; $ I <= 4; $ I ++) {$ Word = String. fromCharCode ($ last_children_name + $ I); $ html + = $ Word + ": <input type = \ "text \" class = \ "mimi \" name = "+ $ Word +"/> ";}} else {$ end = 90-$ last_children_name; for (var $ I = 1; $ I <= $ end; $ I ++) {$ Word = String. fromCharCode ($ last_children_name + $ I); $ html + = $ Word + ": <input type = \ "text \" class = \ "mimi \" name = "+ $ Word +"/> ";}} $ html + = "</div>"; $ this. prev (). append ($ html );}

The above JS is implemented through jquery. The principle is very simple, so I won't say too much.

The clever thing is to add options through assic code digital conversion.