3

（我认为这可能是两个帖子 - 2个问题..所以如果您对此发表评论......我会将它们分开）

主要问题是：

如何为按钮设置图像背景...简单且正确？

我认为现在我可以确定以下事实：

因为我在将图像设置为按钮背景时遇到了一个“小”问题，......我想，好吧，如果很难<input type='button'>用图像背景设置，为什么不改为，只需onclick在 a 上设置事件<input type='image'>！

我是对的（......几乎），因为是的，在 image类型上设置点击事件很容易，而且，设置src..而不是background-image按钮......至少对我来说是这样。

问题是，在当前项目中），使用 jQuery-UI dialog - ok, cancel，

似乎问题在于图像类型，回帖（？！），所以对话框消失了

并且按钮不会导致这个缺陷。

我尝试在vs2010中使用断点对其进行调试，并且单击事件都可以，因为它们都到达了“函数入口”的位置……所以对于图像类型……我只能注释为我可以看到<- Back button, 切换disabled为可点击，所以这意味着它确实回发了。

并且按钮不会发生这种情况，因为您将鼠标悬停在按钮上没有任何事情发生，并且使用图像您可以在状态栏中看到一个链接。

所以按钮-“转换”为图像之间存在差异（真实的），而不是图像变成“按钮”（附加Click()事件），

所以我想知道的是：（只有这次我被允许将这篇文章用于两个答案，因为它们确实相关）

为什么图像回传？我可以禁用此操作吗？...它不是服务器控件。这是你应该知道的事情，并且假设会发生吗？

再次，如果它是题外话，我会移动这个问题，我确实需要一种正确的方法来设置按钮的背景图像，除非它的行为有解决方法。

4

1 回答 1

2

我不确定为什么图像类型输入元素的行为与按钮类型不同，但如果我是你，我会一起避免。如果您正在寻找自定义按钮（看起来就是），我建议您使用 div 并通过 jquery/javascript 控制用户交互。

演示：http: //jsfiddle.net/jrb9249/BvTD5/

HTML：

<body>
    <div class="div_button">
        <p>Click Me!</p>
    </div>
</body>

Javascript：

$('.div_button').click(function(){
    alert('Run a postback via JS');
});

CSS：

.div_button
{
    border: solid 1px gray;
    width:80px;
    height:25px;
    background:#A3A3A3;
    text-align:center;
    margin:0 auto;
    margin-top:50px;
}

.div_button:hover
{
    border: solid 1px blue;
    background:#A1A1A1;
    cursor:pointer;
}

要添加一些收尾工作以完成按钮外观，只需使用此处找到的 jquery 圆角插件添加一些圆角。如果您需要使用此控件进行回发（它看起来不像 asp.net 控件，所以我认为这不是您正在做的事情），您可以使用此处描述的 __Postback 技术。

我希望这会有所帮助，祝你的网站好运。

更新： 自从这篇文章以来，我已经开始将我的 div 标签包含在一个<a>标签中，以在 div 之外创建一个超链接。然后，您可以将自定义单击事件应用于<a>元素，并对您创建的按钮进行更好的控制。

于 2012-12-28T02:39:49.257 回答