Question

我尝试了一种我在某处读到的技术，但它并没有起作用。该技术是创建一个名为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;
}

Answer 1

function() {$('newthreaddiv')应为function() {$('#newthreaddiv')您错过了#。

此外，我不确定这只是一个拼写错误还是在您的实际代码中，但您在用户名输入字段中缺少结束括号（>）。

Answer 2

我建议你不要使用内联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();
    });

});

WORKING EXAMPLE

方法2

但是，如果你需要内联的javascript，请不要使用函数：

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

WORKING EXAMPLE

方法3

你可以使用一个功能，但它需要是一个＆＃34; Immediately-Invoked Function Expression＆＃34; （在这种情况下，我没有看到任何目的）：

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

WORKING EXAMPLE

在页面加载时隐藏div，然后在单击按钮时取消隐藏

2 个答案: