代码之家 › 专栏 › 技术社区 › Gayathri Mohan

按钮内带有背景图像的定位标记将重定向到background href,而不是button onclick链接。

css html jquery javascript

Gayathri Mohan · 技术社区 · 6 年前

我有一个带有href和背景图片的DIV,我也有一个带有onclick的按钮,但是当我试图单击按钮时,它不会重定向按钮链接,因为它会重定向背景href链接。

<div class="banner-container">
<div class="banner-box">
    <div class="banner-div">
        <div class="bannerheading">
            <p><span>The correct link should be&nbsp;</span></p>
        </div>
        <div style="text-align: test">
            <button id="ngwr40hslzejpruyuvx" onclick="window.open('https://stackoverflow.com/')" data-gahref="https://stackoverflow.com/" class="btn btn-primary btn-xs newtab">Learn more</button>
        </div>
    </div>
    <a href="https://www.google.com/">
        <div class="banner-img" style="background-image:url('https://ssl.gstatic.com/gb/images/i1_1967ca6a.png');">
        </div>
    </a>
</div>

没有了对HTE HTML的管理,任何人都能帮上忙吗? https://jsfiddle.net/uqbhcdn6/2/ ,如何重定向按钮单击?

2 回复 | 直到 6 年前

Syamsoul Azrien 6 年前

只需添加CSS pointer-events: fill; 到按钮…

<button style="pointer-events: fill;" id="ngwr40hslzejpruyuvx" onclick="window.open('https://stackoverflow.com/')" data-gahref="https://stackoverflow.com/" class="btn btn-primary btn-xs newtab">Learn more</button>

我编辑你 fiddle 为了你的安逸: https://jsfiddle.net/syamsoul/a8e1kng7/1/

Tanuju 6 年前

去除 指针事件:无 对于.banner div类。上述属性不响应指针事件,因此无法执行单击/悬停事件。

推荐文章

YunusoviÄ · 我无法用css更改html段落颜色

1 年前

Blake · 无法使用CSS旋转Angular 15中的字体图标

1 年前

Maarten -Monica for president · 将图像放在锚点标记内时调整网格中的图像大小

1 年前

Phil Lucks · 如何制作边界的外半径?

1 年前

roy_meir · 创建自定义下拉式元素

1 年前

Community wiki · 如何为触摸设备优化网站

1 年前

Paras Chandravanshi · 为什么<ul>没有从其父<p>元素继承?

1 年前

tpetzoldt · 如何在有光泽的情况下抑制图像的抗锯齿?

1 年前

boyenec · 反应如何将css样式应用于我从api respose获得的页面的spcifc部分

1 年前

manofconstsorrow · 点击导航项目关闭汉堡菜单

1 年前