This article shares a piece of code example, it can click the text box, the ability to pop down the CheckBox checkbox, select the check box to be able to write the value of the text box, may be in the actual application of the effect is not so straightforward and simple, but can be used as an example demo, so that learners understand and expand. The
code is as follows:
The above code to fulfill our requirements, the following describes its implementation process.
Code Comment:
1.$ (function () {}), executes code in the function when the document structure is completely loaded.
2.var position=$ ("#xx"). Offset (), gets the offset of the text box relative to the documents document, and the offset () function returns an object. This object contains two properties left and top, representing the horizontal and vertical offsets relative to the document.
3.$ ("#div1"). Offset ({top:position.top+22,left:position.left}), Sets the offset of the relative document for the pop-up Drop-down menu container, the first plus 22 to make it appear below the text box.
4.$ ("#xx"). Click (function () {$ ("#NG"). Toggleclass ("Open");}, Register the Click event handler for the text box, click it to toggle the style class open Delete and add, that is, set the Drop-down menu display and hide.
5.$ ("#div1 input[name=ng]"). Click (function () {}) registers the Click event handler for a text box with the Name property value of NG.
6.var arr=new Array (), creates an array that holds the value value of the Check checkbox for the selected checkbox.
7.$ ("input[name=ng]:checked"). each (function (key,value) {arr[key]=$ (value). val ();}), The stores the value of the selected check box in an array.
8.$ ("#xx"). Val (Arr.join (","); concatenate an array element into a string to write to a text box.
Hopefully this article will help you learn about JavaScript programming.