Открыть div при клике

Статус
В этой теме нельзя размещать новые ответы.

Lobachevsky

Постоялец
Регистрация
17 Сен 2013
Сообщения
141
Реакции
54
Как сделать чтобы номер телефона отображался только при клике
Код менять не могу т.к. при обновлении все слетит, только добавить css или js
Код:
<div class="field ft_string f_phone">
<div class="title_left">Телефон: </div>
<div class="value"> 123-45-67 </div>
</div>
 
Как сделать чтобы номер телефона отображался только при клике
Код менять не могу т.к. при обновлении все слетит, только добавить css или js
Код:
<div class="field ft_string f_phone">
<div class="title_left">Телефон: </div>
<div class="value"> 123-45-67 </div>
</div>
Для просмотра ссылки Войди или Зарегистрируйся

Для просмотра ссылки Войди или Зарегистрируйся
 
Как сделать чтобы номер телефона отображался только при клике
Код менять не могу т.к. при обновлении все слетит, только добавить css или js
Код:
<div class="field ft_string f_phone">
<div class="title_left">Телефон: </div>
<div class="value"> 123-45-67 </div>
</div>
$(".f_phone").click(function () {
$(this).find('.title_left).toggle();
$(this).find('.value).toggle();
});

нужно, чтоб к странице был подключён jquery, можно даже через cdn
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
 
$(".f_phone").click(function () {
$(this).find('.title_left).toggle();
$(this).find('.value).toggle();
});

нужно, чтоб к странице был подключён jquery, можно даже через cdn
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
Не работает так
 
Не работает так
вот полный рабочий код, только что перепроверил
Код:
<html>
<head>
    <script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
</head>
<body>
<div class="field ft_string f_phone" style='cursor:pointer'>Click
    <div class="title_left" style='display: none'>Телефон: </div>
    <div class="value" style='display: none'> 123-45-67 </div>
</div>
<script>
$(".field").click(function () {
$(this).find('.title_left').toggle();
$(this).find('.value').toggle();
});
</script>
</body>
</html>
P.S.: в предыдущем сообщении отсутствуют закрывающие ', либо я завтыкал когда тайпал, либо сожрало при форматировании
 
Мне кажется лучше вот так сделать

Код:
<html>
<head>
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
</head>
<body>
<div class="field ft_string f_phone" style='cursor:pointer'><div class="title" >Click</div>
    <div class="title_left" style='display: none'>Телефон: </div>
    <div class="value" style='display: none'> 123-45-67 </div>
</div>
<script>
$(".field").click(function () {
$(this).find('.title_left').toggle();
$(this).find('.value').toggle();
$(this).find('.title').toggle();

});
</script>
</body>

Т.е. чтоб при появлении телефонов надпись Click исчезала :)

В принципе задача решена, детали дальнейших действий после открытия телефона ТС не описал, так что вопрос можно считать успешно завершенным
 
Последнее редактирование модератором:
В итоге сделал так, чтобы еще слово показать контакты срывалось при нажатии
Код:
    <h3 class="alert alert-success">
    <script type="text/javascript">
        $(document).ready(function() {
        $("span.spoiler").hide();
        $('<a class="reveal" style="color:#fff;cursor:pointer"></a> ').insertBefore('.spoiler');
        $("a.reveal").click(function(){
        $(this).parents("h3").children("span.spoiler").fadeIn(2500);
        $(this).parents("h3").children("a.reveal").fadeOut(600);
        });
        });
    </script>
        <span class="glyphicon glyphicon-phone-alt"></span>
            <a class="reveal" style="color:#333;cursor:pointer">Показать контакты</a>
        <span class="spoiler" style="display: none;"><?php echo $item['phone']; ?> - <?php echo $item['user']['nickname']; ?></span>
    </h3>    <h3 class="alert alert-success">
    <script type="text/javascript">
        $(document).ready(function() {
        $("span.spoiler").hide();
        $('<a class="reveal" style="color:#fff;cursor:pointer"></a> ').insertBefore('.spoiler');
        $("a.reveal").click(function(){
        $(this).parents("h3").children("span.spoiler").fadeIn(2500);
        $(this).parents("h3").children("a.reveal").fadeOut(600);
        });
        });
    </script>
        <span class="glyphicon glyphicon-phone-alt"></span>
            <a class="reveal" style="color:#333;cursor:pointer">Показать контакты</a>
        <span class="spoiler" style="display: none;"><?php echo $item['phone']; ?> - <?php echo $item['user']['nickname']; ?></span>
    </h3>
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху