Подтвердить что ты не робот

Span с событием onclick внутри тега

Пример кода

<a href="page" style="text-decoration:none;display:block;">
    <span onclick="hide()">Hide me</span>
</a>

Поскольку тег a находится над пролетом, его невозможно щелкнуть. Я пытаюсь z-index, но это не работает

4b9b3361

ОТВЕТЫ

Ответ 1

<a href="http://the.url.com/page.html">
    <span onclick="hide(); return false">Hide me</span>
</a>

Это самое простое решение.

Ответ 2

Когда вы нажимаете hide me, запускаются как a, так и span. Поскольку страница перенаправляется на другую, вы не можете видеть работу hide()

Вы можете увидеть это для уточнения

http://jsfiddle.net/jzn82/

Ответ 3

Fnd ответ.

Я использую некоторые стили inorder для достижения этого.

<span 
   class="pseudolink" 
   onclick="location='https://jsfiddle.net/'">
Go TO URL
</span>

.pseudolink { 
   color:blue; 
   text-decoration:underline; 
   cursor:pointer; 
   }

https://jsfiddle.net/mafais/bys46d5w/

Ответ 4

Ваш код в порядке, он должен выполнить функцию onClick.

Возможно, функция hide() неверна и не выполняется.

Вы получаете какие-либо ошибки в firebug?

Ответ 5

Я бы использовал jQuery для получения результатов, которые вы ищете. Вам не нужно было бы использовать тег привязки в этот момент, но если бы вы это сделали, это выглядело бы так:

<a href="page" style="text-decoration:none;display:block;">

<span onclick="hide()">Hide me</span>

</a>

<script type='text/javascript' src='http://code.jquery.com/jquery-1.7.2.min.js' /
<script type='text/javascript'>
$(document).ready(function(){
     $('span').click(function(){
           $(this).hide();
     }
}

Ответ 6

использовать onmouseup

попробуйте что-то вроде этого

        <html>
        <head>
        <script type="text/javascript">
        function hide(){
        document.getElementById('span_hide').style.display="none";
        }
        </script>
        </head>

        <body>
        <a href="page" style="text-decoration:none;display:block;">
        <span   onmouseup="hide()" id="span_hide">Hide me</span>
        </a>
        </body>
        </html>

EDIT:

          <html>
        <head>
        <script type="text/javascript">
        $(document).ready(function(){
         $("a").click(function () { 
         $(this).fadeTo("fast", .5).removeAttr("href"); 
        });
        });
        function hide(){
        document.getElementById('span_hide').style.display="none";
        }
        </script>
        </head>

        <body>
        <a href="page.html" style="text-decoration:none;display:block;" onclick="return false" >
        <span   onmouseup="hide()" id="span_hide">Hide me</span>
        </a>
        </body>
        </html>