Как сбросить только тексбокс, а не всю страницу?

Я пытаюсь создать систему публикации/комментирования. Он делает большую часть того, что я хочу. Теперь я хочу иметь только сброс текстового поля, а не всю страницу. Код скелета задается с помощью CodePen. (Более объяснение с образцом кода)Как сбросить только тексбокс, а не всю страницу?

HTML:

<form id="frmPost" name="write"> 
    <div class="textbox"> 
     <input class="postwriter" name="post" type="text" placeholder="What's on your mind?" id="txtPost"> 
     <button id="btnPost" onclick= "return write_below(this); resetText();" value="submit" >Post</button> 
    </div> 
</form> 
<div class="posts" id="postDisplay"> 
    <p class="para"><span id='display'></span></p> 
</div>

JS:

function resetText() { 
    document.getElementById('txtPost').value=""; 
    //return false; 
} 
function write_below(form){ 
    var input = document.forms.write.post.value; 
    //document.getElementById('display').innerHTML += input + "<br/>" + "<br/>"; 
    document.getElementById('display').innerHTML += "<p>" + Math.floor(Math.random()*20) + ": " + input + "</p>" + "<br/>"; 
    return false; 
}

Подобно этому, пост сохраняется, но текстовое поле сбрасывается. Если я избавлюсь от второго комментария return false;, вся страница сбрасывается.

источник

2016-12-15 user147219

Все, что вам нужно сделать, это вызов resetText() из write_below()

function resetText() { 
 
    document.getElementById('txtPost').value=""; 
 
} 
 
function write_below(form){ 
 
    var input = document.forms.write.post.value; 
 
    document.getElementById('display').innerHTML += "<p>" + Math.floor(Math.random()*20) + ": " + input + "</p>" + "<br/>"; 
 
    resetText(); 
 
    return false; 
 
}

<form id="frmPost" name="write"> 
 
    <div class="textbox"> 
 
    <input class="postwriter" name="post" type="text" placeholder="What's on your mind?" id="txtPost"> 
 
    <button id="btnPost" onclick= "return write_below(this);" value="submit" >Post</button> 
 
    </div> 
 
</form> 
 
<div class="posts" id="postDisplay"> 
 
    <p class="para"><span id='display'></span></p> 
 
</div>

источник

2016-12-15 21:25:52 Slonski

Когда вы нажимаете кнопку submit, действие по умолчанию для формы - это сделать запрос. Если в вашем <form action=""></form> адресата нет, по умолчанию используется "/" (текущая страница). Это перезагрузит страницу.

Когда вы говорите return false, вы возвращаете ложное значение вызывающему абоненту (форме). Это отказывает в правильной отправке формы, тем самым предотвращая перезагрузку.

Оставьте return false;, чтобы получить результат.

источник

2016-12-15 19:37:05

Почему написать пространное JavaScript или JQuery

Вы можете поставить четкую кнопку с типом 'перезагрузки'. Он очистит ваше поле формы без перезагрузки веб-страницы.

Например.

<html> 
     <body> 
       <form> 
         <input type="text" name="demo"> 
         <button type="reset">Clear</button> 
         <button type="submit">Submit</button> 
       </form> 
     </body> 
    </html>

источник

2016-12-16 06:35:42 Hanumant

Как сбросить только тексбокс, а не всю страницу?

ответ

Смежные вопросы