我已经束手无策了！我正在尝试做一些（我相信）是一个非常简单的 jQuery UI 过程，但我无法让它工作。我不确定将什么确定为导致问题的变量。
它可能是：
- 我的代码
- 视觉工作室 2012 RC
- jQuery UI 1.8.22
我想要做的是创建一个 jQuery 按钮并在其上放置一个图标。我想要的图标就是plus-thick图标。
这是页面的css和js“导入”（它们的顺序不正确？？？）：
<link rel="stylesheet" type="text/css" href="Content/Default.css" />
<link rel="stylesheet" type="text/css" href="Content/themes/cupertino/jquery-ui-1.8.22.custom.css" />
<script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.8.22.custom.min.js"></script>
这是我用来尝试执行此操作的代码：
$('.headerButtonsDiv > a')
.button()
.button("option", "icons", { primary: 'ui-icon-plus-thick' })
.click(function () {
var text = $(this).text();
alert(text + ' clicked!');
return false;
});
这是我的第一次尝试（顺便说一下，结果与上面相同）：
$('.headerButtonsDiv > a')
.button( { icons: { primary: 'ui-icon-plus-thick' } } )
.click(function () {
var text = $(this).text();
alert(text + ' clicked!');
return false;
});
此代码影响三个按钮。
结果如下：
- 元素被
<a>正确地转换为 jQuery 按钮。 - 每个按钮正确地在按钮的左侧都有一个图标。
- 每个按钮错误地都有
carat-1-n图标而不是plus-thick。
当我进入页面检查器（使用 IE 和/或 Chrome）时，我深入到button（转换后的<a>元素）并查看它及其 2<span>个子元素。虽然<span>图标的元素确实应用了ui-icon-plus-thick类，但它没有应用任何类background-position。
因此，尽管该课程存在，但实际上并未应用。当我手动添加background-position属性 ( background-position: -32px -128px;) 时，“神奇地”出现了正确的图标 ;-)。
我想我可以找到一个解决方法，我创建按钮，然后尝试选择正确的<span>子元素，然后“手动”应用background-position自己，但这不正是jQuery 库应该做的吗？
无论如何，如果有人能看到我出轨的地方，我将不胜感激！这确实是一个小问题，但如果我不能让这个工作，我对更复杂的问题没有信心。