Home > Web Front-end > Layui Tutorial > How to set checkbox in layui

How to set checkbox in layui

爱喝马黛茶的安东尼
Release: 2019-07-11 11:56:20
Original
6196 people have browsed it

How to set checkbox in layui

First you need to introduce layui’s js script file and css style file. If you need to use jquery, the corresponding files are also introduced.

How to set checkbox in layui

#html, we write the corresponding check box control, which is the commonly used checkbox. But what needs to be noted here is that a title value must be added to the checkbox, and the control must be placed in a form with the style layui-form.

How to set checkbox in layui

In the ready function after the page is loaded, (jquery is used here), we need to introduce the form component of layui, and then call the render method.

How to set checkbox in layui

That’s it, basically it’s OK, there’s not much complexity. Run the page and you can see the beautiful checkbox appear.

How to set checkbox in layui

Related recommendations: "layui framework tutorial"

But when I see the pictures above, it seems that some pictures are not displayed properly. ? In fact, this is caused by the custom fonts in layui not loading properly. We need to copy the fonts in layui to our own site, and just put the entire font folder in the same directory as css and js.

How to set checkbox in layui

# Refresh the page and you will see a beautiful check box.

How to set checkbox in layui

Click on the first check box to see the selected status.

How to set checkbox in layui

The above is the detailed content of How to set checkbox in layui. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template