Как я могу изменить встроенный стиль CSS при нажатии на ссылку?

Question

у меня есть скрытая форма со встроенным style="display: none;"

как я могу динамически изменить этот стиль на style="display: inline;" при нажатии на ссылку на странице?

Answer 1

Prety simple

<a href="#" onclick="document.getElementById('myform').style.display = 'inline';">Click me</a>

Обновление

---

jQuery - это легкая библиотека JavaScript, которая может выполнять множество интересных вещей, с написанием очень меньшего количества скриптовсо стороны разработчиков.

Прежде всего, я предлагаю вам прочитать " Как работает jQuery? ", есть все, что вам нужно, чтобы начать использовать jQuery.

---

Я объясню код, который я написал в скрипке.

Прежде всего ссылка и форма

<a id="linktotoggle" href="#">Click Me</a>
<form id="formtotoggle"></form>

Запомните идентификатор в ссылке и форме выше.Вот как мы собираемся выбрать элемент в скрипте так же, как это делает document.getElementById().

Позволяет скрыть форму по умолчанию

#formtotoggle { display: none; }

Теперь давайте напишем jquery

$(document).ready(function() {
// ^ This is an event, which triggers once all the document is loaded so that the manipulation is always guaranteed to run.
   $("#linktotoggle").click(function() {
   // ^ Attach a click event to our link
        $("#formtotoggle").toggle();
        // ^ select the form and toggle its display

   });
});

Надеюсь, этого достаточно, чтобы вы начали.

Answer 2

Вот еще несколько кодеков

 <a href="#" id="yourlink">yourlink</a>
    <form id="yourform" style="display:none;">form here.</form>
    <script>
    $(document).ready(function () {
        $('#yourlink').click(function () {
            $('#yourform').css('display', 'inline');
        });
    });
    </script>

Answer 3

Сначала вам нужно будет найти способ выбора формы с помощью JavaScript;Вот функция, предполагающая, что ваша форма имеет атрибут id myform:

function showForm() {
    document.getElementById('myform').style.display = 'inline';
}

Затем просто привяжите эту функцию к событию click вашей ссылки.Быстрый и грязный способ - установить для атрибута onclick ссылки значение showForm(); return false, но вы, вероятно, захотите сделать это во внешнем JavaScript, чтобы красиво разделить ваш контент и поведение.

Answer 4

Эй, проверьте этот JQuery.

Для Шоу

$("#lnk").click(function () {  
$("#result").removeAttr('Style');
$("#result").attr('Style','display: inline;'); // this 
$("#result").attr('Style','display: block;'); // or this

}); 

для скрытия

$("#lnk").click(function () {  
$("#result").removeAttr('Style');
$("#result").attr('Style','display: none;');
}); 

Answer 5

Привязать событие onclick к привязке и установить стиль формы на display:block, вот скрипка js, чтобы помочь вам перейти на

http://jsfiddle.net/ZUgPv/1/