2017-08-25 81 views
4

我使用jquery将一些默认内容放置到<textarea>中,但随后试图通过重置为原来实现按钮来清除任何新用户添加到<textarea>。我尝试使用由jquery点击函数触发的.val('')清除<textarea>,然后再次重新启动代码,但由于某种原因,<textarea>在我尝试重置(第一次尝试查找)后仍保持空白。无法找出这一个!使用val('')来清除文本区域

该代码是我正在研究在英语课堂中教授正确的逗号用法。在这里它的工作:https://codepen.io/brentsimpson/pen/EvveKw

function start() { 

var text = "We need walnuts, cinnamon, sugar, and milk."; 
var newText; 
var selectComma = ","; // this could be any punctuation you want 
var hits = []; 
var commaCheck; 
var commaPlacement; 
var progressBar = 0; 
var offset = 0; 

newText = text.replace(/,/g, ''); 

$("#commabox").text(newText); //writes newText to textarea 
$("#commanumber").text(commanumbertext); 

console.log("The sentence is " + text.length + " characters long."); 

for(i = 0; i<text.length; i++){ 
if(text[i] === selectComma){ 
    commaPlace = i - offset; 
    offset = offset + 1; 
    hits.push(commaPlace); 
    } 
} 

var commaNumber = hits.length; 
var commanumbertext = "There should be " + commaNumber + " commas in this sentence."; 
var progressBarProgress = Math.round(100/hits.length); 
$("#progressbardisplay").css('width', progressBar + "%"); // resets the progress bar 

console.log("Commas were placed at these characters: " + hits); 


/* code runs after keypress and checks if a comma has been placed 
    at a place where one was removed */ 
$("#commabox").keypress(function(event) { 
    commaCheck = event.which; 
    console.log(commaCheck + " was pressed."); 
    var caret = $("#commabox").caret(); 
    commaPlacement = caret["begin"]; //assigns value of begin in caret object to commaPlacement 
    console.log("Comma placed at " + commaPlacement); 
    checkCommaPlacement(); 
      }); 

/* this function checks if commas have been placed at the 
right place in the string. Could probably use indexOf() here instead 
*/ 
function checkCommaPlacement() { 
    a = hits.indexOf(commaPlacement); 
    if (commaCheck === 44 && a != -1) { 
     progressBar = progressBar + progressBarProgress; 
    $("#progressbardisplay").css('width', progressBar + "%"); 
    console.log("Comma is in array at " + a); 
    for (var i = a; i < commaNumber; i++){ 
     hits[i] += 1; // updates the array places above comma 
     }} else { 
    console.log("Comma incorrecly placed.") }    
    }; 

}; 

start(); 

$(".btn").click(function() { 
    $('#commabox').val(''); 
    start(); 
}); 

回答

1

使用.val(newText),而不是.text(newText)设置textarea的文字:

$("#commabox").val(newText); //writes newText to textarea 
0

在这里,这应该够你试图实现:

$('document').ready(function() { 
 
    
 
    var $textarea = $('#textarea1'); 
 
    
 
    $textarea.attr('data-default-value', $textarea.val()); 
 
    
 
    $('#clear').click(function() { 
 
    $textarea.val($textarea.data('default-value')); 
 
    }); 
 
    
 
});
<textarea id="textarea1">Default value</textarea> 
 

 
<button id="clear">Clear</button> 
 

 
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>