Делать div скрытым при загрузке страницы и затем скрытым при нажатии кнопки

Question

Делать div скрытым при загрузке страницы и затем скрытым при нажатии кнопки

0

Я пробовал технику, о которой я где-то читал, но она не работает. Техника заключалась в том, чтобы создать класс, называемый hidden который удаляется при вызове функции. Поскольку я новичок в использовании JQuery, я думаю, что что-то может быть неправильно с тем, как я писал функцию onclick. Я отправлю свою попытку, и тогда я буду признателен, если вы сможете помочь мне исправить мои ошибки.

HTML:

    <button onclick="function() {$('newthreaddiv').removeClass('hidden');}">New Thread</button>
    <div class="boardbox hidden" id="newthreaddiv">
        <p>Username:<input class="threadipt" type="text"</p>
        <p>Password:<input class="threadipt" type="text"></p>
        <p>Title:<input class="threadipt" type="text"></p>
        <p>Content:</p>
        <button class="threadbutton">bold</button>
        <button class="threadbutton">italicize</button>
        <button class="threadbutton">underline</button>
        <button class="threadbutton">insert image</button>
        <textarea id="newthreadtxt"></textarea>
        <p><button onlick="phpfunction">Create Thread</button></p>
    </div>

CSS:

div.boardbox
{
    background-color: #ccc;
    padding: 5px;
    margin: 20px;
}

div.hidden
{
    display: none;
}

user3537336 17 апр. 2014, в 01:26

Источник

Теги:

javascript

jquery

html

css

2 ответа

2

function() {$('newthreaddiv') должна быть function() {$('#newthreaddiv') Вам не хватает #.

Кроме того, я не уверен, что это только опечатка или в вашем фактическом коде, но вам не хватает закрывающей скобки (>) в поле ввода имени пользователя.

Dryden Long 16 апр. 2014, в 20:29

Ещё вопросы

showdev · Accepted Answer · 2014-04-16T20-27-00.000Z

Я рекомендую вам не использовать встроенный javascript. Вместо этого создайте прослушиватель для событий щелчка на кнопке.

<button id="new_thread">New Thread</button>
<div class="boardbox hidden" id="newthreaddiv">
   ...
</div>

jQuery(function() {

    jQuery('#new_thread').on('click',function() {
        jQuery('#newthreaddiv').show();
    });

});

РАБОЧИЙ ПРИМЕР

СПОСОБ 2

Однако, если вам нужно, чтобы javascript был встроенным, не используйте функцию:

<button onclick="$('#newthreaddiv').removeClass('hidden');">New Thread</button>

РАБОЧИЙ ПРИМЕР

МЕТОД 3

Вы можете использовать функцию, но она должна быть выражением " Вызываемое мгновенное выражение " (и я не вижу в этом контексте никакой цели):

<button onclick="(function() {$('#newthreaddiv').removeClass('hidden');}())">New Thread</button>

РАБОЧИЙ ПРИМЕР

+1 Ты приложил больше усилий, чем я. OP, если вы читаете это, примите этот пост как правильный ответ.