Question

我这里有一个代码，可以将您单击的文本输入到下面的文本框中。

但问题是它没有鼠标悬停，它只显示文本符号。

为什么有任何方法可以修复或改变它？或者当你将鼠标悬停在文字符号上时，可以将其点击为没有文字符号的链接？

  <style type='text/css'>
    #navlist {
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
#navlist li {
    display: inline;
    list-style-type: none;
    text-decoration: none;
    padding-right: 0px;
    color: #b7b7b7;
}
#navlist li a {
    text-decoration: none;
    color: #b7b7b7;
}
#navlist li a:hover {
    text-decoration: underline;
    color: #b7b7b7;
}

  </style>



<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
$('a.linkInsert').click(
    function(e){
        e.preventDefault();
        $('#linkText').val($(this).data('value'));
    });
});//]]>  

</script>


</head>
<body>
          <ul id="navlist">
          <li><a class="linkInsert" data-value="1">Link (email &amp; IM)</a></li>
          &nbsp;|&nbsp;
          <li><a class="linkInsert" data-value="2">Direct Link (email &amp; IM)</a></li>
          &nbsp;|&nbsp;
          <li><a class="linkInsert" data-value="3">HTML Image (websites / blogs)</a></li>
          </br>
          <li><a class="linkInsert" data-value="4">HTML Link (websites / blogs)</a></li>
          &nbsp;|&nbsp;
          <li><a class="linkInsert" data-value="5">Message Boards</a></li>
        </ul>
        <input id="linkText" />

</body>

Answer 1

没有指针图标，因为您没有与href关联的<a>属性。您可以添加href="#"之类的内容，也可以添加css规则：

#navlist li a {
    cursor: pointer;
}

Answer 2

#navlist li {
    display: inline;
    list-style-type: none;
    text-decoration: none;
    padding-right: 0px;
    color: #b7b7b7;
    cursor:pointer;
}

以下是演示：http://jsfiddle.net/gQms9/15/

鼠标悬停而不是文本符号

2 个答案: