data-toggle="dropdown"/data-target/data-dismiss/data-backdrop/data-spy/data-slide/data-source是什么意思?

禹昆
2023-12-01

在Bootstrap框架中查阅图灵计算机大词典:

data-toggle="dropdown":

n.数据柄-下拉菜单模块

data-***=“***”又有何意义?

其主要功能作用——数据与模块进行联动:打开,切换,下拉,监听,触发,引入,输入,弹出,绑定,关闭,删除,控制或隐藏等等模块功能。

data-toggle即作为数据柄栓媒介把其后面"dropdown"下拉菜单添加切换到诸如按钮button等页面元素上,起到联动中介,点击下拉作用。

以下举个案例:

【Eg1】

data-target="modal":

n.数据靶-模态对话框模块;

data-target即作为数据靶子媒介把其后面"modal"模态对话框添加切换到诸如按钮button等页面元素上,起到联动中介,点击打开作用。

【Eg2】

data-dismiss="alert";

n.数据解散-警告框模块

data-dismiss即作为数据解散删除X媒介把其后面"modal"模态对话框添加切换到诸如按钮button等页面元素上,起到联动中介,点击删除/关闭作用。

【Eg3】

data-backdrop="backdrop";

n.数据背景-背景幕模块;

data-dismiss即作为数据背景媒介把其后面"backdrop"背景幕对话框添加切换到诸如按钮button等页面元素上,起到联动中介,点击切换作用。

【Eg4】

data-spy="scroll";

n.数据监听-滚动条模块;

data-dismiss即作为数据监听媒介把其后面"scroll"滚动条模块添加切换到诸如按钮button等页面元素上,起到联动中介,点击监听作用。

【Eg5】

data-animation="animation"

n.数据动画-动画模块;

data-animation即作为数据动画媒介把其后面"animation"动画模块添加切换到诸如按钮button等页面元素上,起到联动中介,点击触发/引入作用。

【Eg6】

data-loading-text="Loading..."

n.数据下载文本-下载模块;

ata-loading-tex即作为数据下载文本媒介把其后面"Loading..."下载模块添加切换到诸如按钮button等页面元素上,起到联动中介,点击绑定作用。

【Eg7】

data-slide="prev",向前滑动

data-slide="next"; 向后滑动

n.数据滑动-滑动轮播模块;

data-slide即作为数据滑动媒介把其后面"prev"/"next"滑动轮播模块添加切换到诸如按钮button等页面元素上,起到联动中介,点击控制轮播的位置作用。

【Eg8】

data-source="items"

n.数据源-项目模块;

data-source即作为数据源媒介把其后面"items"项目模块添加到诸如按钮button等页面元素上,起到联动中介,点击输入提示输入框初始化作用。


不一而足.......


 类似资料: