元素只能在特定位置选择答案

【问题标题】：Element is selectable only on specific place元素只能在特定位置选择
【发布时间】：2017-08-28 07:49:23
【问题描述】：

我有以下超链接

<a href="courses.html"><i class="fa fa-thumbs-up icon_1" style="font-size: 20px; transition: color 0.2s ease 0s, border-color 0.2s ease 0s, background-color 0.2s ease 0s; min-height: 0px; min-width: 0px; line-height: 20px; border-width: 0px 2px 0px 0px; margin: 0px; padding:0px 10px 0 0; letter-spacing: 0px;"></i>Test Text</a>

可以看到它指向我的应用程序中的另一个页面。问题出在“网站的移动版本-响应式网站”上-仅当用户单击“按钮”的开头时才会发生重定向。例如，如果我在测试和文本之间单击或在文本结尾处单击，则根本不会发生重定向。

我尝试添加一个 Id 并使用 Jquery 捕获点击事件并删除该元素在照片上的图标：

<a id="TestClick" href="courses">Test Text</a>

$("#TestClick").click(function () {
    console.log("BLA BALDS:LAD:LA")
});

再次运气不好，必须在文本开头单击元素才能检测到单击事件

我尝试了在“a”标签内使用和不使用 href="courses" 的最后一个代码。我想提一下，只有在移动设备上使用该页面并在 Google Chrome 的切换设计工具打开时才会出现问题。我想解决这个问题，因为我真的很烦用户在某个“按钮”上单击不止一次

【问题讨论】：

你能在 JSBin 之类的网站上复制吗？我认为缺少一些代码，例如，#TestClickCourses 与您发布的任何 HTML 都没有关联。如果您可以在 JSBin 或类似设备上重现，我们可以提供更好的帮助。如果没有，我可能会看一下：1.没有任何元素与您的元素重叠，使其无法点击，因为重叠元素被阻塞或 2.您正在尝试选择一个子元素作为可点击元素并且您想要一个父元素
jsbin.com/wigisexapa/edit?html,js,console

标签： javascript jquery html devise responsive-design

【解决方案1】：

用&nbsp; 代替每个空格字符。像这样：

<a id="TestClick" href="courses">Test&nbsp;Text</a>

【讨论】：

把你的代码放在像<span>Test&nbsp;Text</span>这样的span标签中，然后再试一次。
Test Text 又没有运气了。我也试过 Test Text 但它也没有用。为什么这个元素的行为是这样的哦
试试这个 jQuery 代码：jQuery(document).ready(function(){ jQuery('TestClickCourses').click(function(){ window.location.replace('/courses.html'); }); });
如果您正在使用像 bootstrap 这样的 CSS 框架，请告诉我。
再次仅在文本开头触发（就像我在照片上显示的那样）。为什么这只发生在移动设备上？是的，我正在使用引导程序。