Yesterday to do the parsing of XML, began the preliminary typesetting today, intends to begin to separate each item into a row.
Today all kinds of tests, finally put append insert line solved. Yesterday I used bootstrap, but the first time I used bootstrap I should have been blamed for not being successful. Today all use the html5+ MUI plugin. The code is as follows:
var newitem = $ ('<li class= "Mui-table-view-cell" ><p>'+item_name+ ' </p><span></span><div class= "Mui-switch mui-active" data-switch= "1" ><div class = "Mui-switch-handle" ></div></div></li>"); $ ("#main "). Find ('ul'). Append (NewItem);
The HTML file is as follows:
<body> <div id="Header"> <p>OpenHab-Html5</p> </div> <divclass="mui-content"Id="Main"> <ulclass="Mui-table-view"> <liclass="Mui-table-view-cell"> <p>Hello</p> <span></span> <divclass="Mui-switch mui-active"> <divclass="Mui-switch-handle"></div> </div> </li> </ul> < /div> </body>
The results are as follows:
However, there is a problem: Append insert and Direct write in the HTML is different, append inserted toggle can not toggle the state and write directly to the switch.
The chrome debug results are mapped as follows:
My side is very depressed, asks the HTML expert to instruct ...
--This article by damoyelang1992 in Cnblog first, in the Open source Smart Home Forum has the post reprint please contact [email protected]--
Openhab HTML5 Mobile Phone client making problem--my Bishi (iii)