怎么用jquery在页面上动态创建一个button按钮？

创建按钮 data-role=button

给HTML元素添加 data-role="button" 属性。jQuery Moble就会给此元素增强为按钮样式。 Jquery

Mobile框架包含了一组最常用的移动应用程序所需的图标，为了减少下载的大小，Jquery

Mobile包含的是的白色的图标sprite图片，并自动在图标后添加一个半透明的黑圈以确保在任何背景色下图片都能够清晰显示。

样式链接按钮

在一个网页的主要内容块，你可以样式的任何锚链接为按钮添加 data-role="button"

属性。该框架将加强与标记和类的链接方式链接按钮。例如，这个标记：

图标样式列表

jQuery Mobile 自带很多按钮小图标，如下图所示：

左箭头：data-icon="arrow-l"

右箭头：data-icon="arrow-r"

上箭头：data-icon="arrow-u"

下箭头：data-icon="arrow-d"

删除：data-icon="delete"

添加：data-icon="Plus"

减少：data-icon="minus"

检查：data-icon="Check"

齿轮：data-icon="gear"

前进：data-icon="Forward"

后退：data-icon="Back"

网格：data-icon="Grid"

五角：data-icon="Star"

警告：data-icon="Alert"

信息：data-icon="info"

首页：data-icon="home"

默认情况下，所有的图标都放在按钮的按钮文本左。此默认可以覆盖使用 data-iconpos

属性来设置图标的右上方（top）、底部（bottom）、右侧（right）、左侧（left）的文本。例如，标记：

隐藏图片上的文字 data-iconpos="notext"

你也可以创建一个图标按钮，设置

data-iconpos="notext"。按钮插件将隐藏的文字在屏幕上，但把它作为给屏幕阅读器和设备支持工具提示上下文链接标题属性。例如，data-iconpos="right"，data-iconpos="notext"：

使用自定义图标，需要指定 data-icon 值。Jquery Mobile的button插件会将生成一个CSS类，它的前缀是ui-icon-

，后面的是data-icon值。假如：有一个按钮 data-icon 属性的值为 myapp-email，即 data-icon=“

myapp-email”。那么生产的CSS类是：ui-icon-myapp-email。

然后你可以在你的样式表写一个CSS规则来定义

ui-icon-myapp-email。然后在css中指定这个类的背景图片地址。为了保持与其他图标的视觉上的一致性，请创建一个白色18x18像素的PNG-8图标，并且保存为Alpha透明度。

这将创建标准分辨率的图标，但许多设备都有非常高的分辨率的显示器，就像iPhone

4的视网膜显示器。添加一个高清图标，创建一个图标，36X36像素（18像素大小完全相同的两倍），并添加第二个规则使用WebKit分钟装置像素比例：2。媒体查询到目标的规则只有以高分辨率显示器。指定背景图片高清图标文件和设置背景像素大小18x18将安装36个像素图标到同一个18像素的空间。传媒查询块可以用多个图标规则：

首先要给图片添加一个Id，之后在jquery中写如下代码：

$("#图片ID").click(function(){

alert("aa”)

})

或者

$("#图片ID").bind("click",function(){

alert("aa")

})

扩展资料：

Click 事件实际应用：

此事件是在一个对象上按下然后释放一个鼠标按钮时发生。它也会发生在一个控件的值改变时。

对一个 Form 对象来说，该事件是在单击一个空白区或一个无效控件时发生。对一个控件来说，这类事件的发生是当： 用鼠标的左键或右键单击一个控件。对 CheckBox, CommandButton, Listbox 或 OptionButton 控件来说，Click 事件仅当单击鼠标左键时发生。

通过按下箭头键或者单击鼠标按钮，对 ComboBox 或 ListBox 控件中的项目进行选择。

当 CommandButton,OptionButton 或 CheckBox 控件具有焦点时，按下 SPACEBAR 键。

当窗体带有其 Default 属性设置为 True 的 CommandButton 控件时，按下 ENTER 键。

当窗体带有一个 Cancel 按钮 — 其 Cancel 属性设置为 True 的 CommandButton 控件时，按下 ESC 键。

对控件按下一个访问键。例如，如果一个 CommandButton 控件的标题是 "&Go"，则按下 ALT+G 键可触发该事件。 也可在代码中触发 Click 事件，通过： 将一个 CommandButton 控件的 Value 属性设置为 True。

将一个 OptionButton 控件的 Value 属性设置为 True。

改变一个 CheckBox 控件的 Value 属性的设置。

参考资料来源：百度百科：Click事件

添加删除是一项基本功能，下面就来看一下jquery怎么在图片上添加删除按钮。

设备：联想电脑

系统：xp

软件：jQuery2019

1、首先写一个HTML架构，如图所示代码。

2、新建一个div，div中包裹着一个img标签，视为图片。

3、再次书写一个div，之后会赋予点击事件。

4、然后使用onclick函数进行点击时间的绑定，如图所示。

5、引入jquery.js，之后使用其中的函数。

6、最后编写addButton方法，这样一切就完成了。

---