Выделите определенный DIV - PullRequest
Новая
       2

Выделите определенный DIV

0 голосов
/ 29 ноября 2011

Я пытаюсь «выделить» определенный div.

Вот мой HTML-код 

<!DOCTYPE html>
<html>
    <head>
        <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
        <style type="text/css">div { margin: 0px; width: 300px; height: 80px; background: #FFF; border: 1px solid black; position: relative; }</style>
        <script>
            $(document).ready(function() {
                $("a").click(function () {
                    $("div").effect("highlight", {color:"#FF0000"}, 3000);
                });
            });
        </script>
    </head>
    <body>
        <a href="#id_1"><b>id_1</b></a>
        <br/>
        <a href="#id_2"><b>id_2</b></a>

        <br/><br/><br/><br/>
        <div id="id_1"><h2>id_1 - <a class="altlink" href="#top" name="id_1" id="id_1">Top</a></h2></div>
        <div id="id_2"><h2>id_2 - <a class="altlink" href="#top" name="id_2" id="id_2">Top</a></h2></div>
    </body>
</html>

Когда я нажимаю на элемент a с помощью href #id_1как сделать так, чтобы он выделил элемент <div id="id_1">?

Спасибо!

Ответы [ 4 ]

1 голос
/ 29 ноября 2011

Попробуйте: 

$('a[href^="#id"]').on('click', function() {
    var sHref = this.href.split('/');
    $(sHref[sHref.length - 1]).effect("highlight", {
        color: "#FF0000"
    }, 3000);
});

Fiddle: http://jsfiddle.net/maniator/4PgC6/

Примечание: : Если используется jQuery <1.7, выполните: </p> 

$('a[href^="#id"]').click(function() {
    var sHref = this.href.split('/');
    $(sHref[sHref.length - 1]).effect("highlight", {
        color: "#FF0000"
    }, 3000);
});

Скрипка: http://jsfiddle.net/maniator/4PgC6/9/

0 голосов
/ 28 апреля 2014

$ (документ) .ready (function () {$ ("a # id_1"). Click (function () {
$ ("div # id_1"). Effect ("highlight",{color: "# FF0000"}, 3000); вернуть false;}); $ ("a # id_2"). click (function () {
$ ("div # id_2"). effect ("highlight"), {color: "# 0000FF"}, 3000); вернуть false;});});

, а HTML-код будет иметь тег "A", который имеет вид [code]

a href = "#" id = "id1"

a href = "#" id = "id2"

0 голосов
/ 29 ноября 2011

вам нужно использовать вот так: 

$(document).ready(function() {
    $("a").click(function () {
                    $(this).parent().parent().effect("highlight", {color:"#FF0000"}, 3000);
                });
            });

РЕДАКТИРОВАТЬ: исправил ошибку, поставил второй вызов .parent ()

0 голосов
/ 29 ноября 2011

Попробуйте это: 

$('a').click(function() {
    var selector = $(this).attr('href');

    // Highlight div with whatever CSS you like
    $(selector).effect("highlight", {color:"#FF0000"}, 3000);
}

При этом используется атрибут href ссылки в качестве селектора для строки .effect().

...