Maison > interface Web > js tutoriel > le corps du texte

select标签模拟/美化方法采用JS外挂式插件_jquery

WBOY
Libérer: 2016-05-16 17:38:49
original
1481 Les gens l'ont consulté

在这将本人对,仅改变外观,不改变不干预Form行为,后期加载JS。(注:本脚本依赖jQuery)

啥也不说了,都在代码里。

复制代码 代码如下:
 
$(document).ready(function () {
// 找出需要美化的则将被忽略
var selects = $("select.beautify");
if (selects.length > 0) {
//先在代码底部增加一个
,用来承载和显示下拉框选项
$("body").append("");
//挨个美化呗
selects.each(function () {
//给本函数下的 this (也就是 , .dummy 将用于我们对此类 进行专门样式定义
//同时将 插入 dom, 紧跟原 ")
.attr("disabled", this.disabled)
.css("width", parseInt(this.style.width) + "px")
.css("display", this.style.display)
.insertAfter(this)
.val(this.options[this.selectedIndex].text);
//将 被点击时
input.click(function () {
//调出前面创建的
,并清空内容
//将 一致
$(select).hasClass("extend")
? div.css("width", "")
: div.css("width", $(this).innerWidth());
//将
Étiquettes associées:
source:php.cn
Article précédent:点击隐藏页面左栏或右栏实现js代码_javascript技巧 Article suivant:html组件不可输入(只读)同时任何组件都有效_jquery
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal