我试图从文本区域中删除搜索字符,然后重新显示没有搜索字符的新文本。我已经做了所有我能做的,但它所做的只是删除搜索字符,而不是重新显示没有字符的文本。
我尝试用空格替换单词中的搜索字符,但没有任何效果。
$(document).ready(function() {
//On click of button, generate text in text area
$('#generateText').click(function(event) {
var text = $('#textArea').val("Tom Cruise once ate a 4000ft long subway sandwichs and then he played Nathan Drake!")
})
$('#submit').click(function() {
event.preventDefault();
//Number of Words
var text = $('#textArea').val();
var numWords = text.trim().split(/\s+/).length;
$('#numWords').val(numWords);
//Occurance Number
var searchChar = $('#searchChar').val();
var numOccurance = (text.match(new RegExp(searchChar, "gi")) || []).length;
$('#numOccurance').val(numOccurance);
$('#numOccurance').val(numOccurance);
//Caps Text
var text = $('#textArea').val();
var uppercaseText = text.toUpperCase();
$('#capsText').val(uppercaseText);
//Removes Search Character
var removedCharText = text.replaceAll(searchChar, '');
$('#removeChar').val(removedCharText);
$('#removeChar').val(searchChar);
// Date
var numDays = $('#numDays').val();
var currentDate = new Date;
currentDate.setDate(currentDate.getDate() + parseInt(numDays));
var formatDate = (currentDate.getMonth() + 1) + '/' + currentDate.getDate() + '/' + currentDate.getFullYear();
//Displays the reformated new date in the Modified Date Field
$('#modifiedDate').val(formatDate);
})
})
table {
border-collapse: separate;
border-spacing: 15px;
}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<h2>Trevor Supek - IT 2320 - Lab 10</h2>
<h3>Working with Strings and Dates</h3>
<form>
<table>
<tr>
<td>Select the <strong>Search Character</strong>:</td>
<td>
<select id="searchChar">
<option value=""></option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
<option value="D">D</option>
<option value="E">E</option>
<option value="F">F</option>
<option value="G">G</option>
<option value="H">H</option>
<option value="I">I</option>
<option value="J">J</option>
<option value="K">K</option>
<option value="L">L</option>
<option value="M">M</option>
<option value="N">N</option>
<option value="O">O</option>
<option value="P">P</option>
<option value="Q">Q</option>
<option value="R">R</option>
<option value="S">S</option>
<option value="T">T</option>
<option value="U">U</option>
<option value="V">V</option>
<option value="W">W</option>
<option value="X">X</option>
<option value="Y">Y</option>
<option value="Z">Z</option>
</select>
</td>
</tr>
<tr>
<td>Type or paste in some text:</td>
<td><textarea id="textArea" cols="40" rows="15"></textarea><input type="button" id="generateText" name="generate" value="Generate Text"></td>
</tr>
<tr>
<td>Date Modifier - Number of Days:</td>
<td><input type="number" id="numDays"></td>
</tr>
<tr>
<td>Number of words entered:</td>
<td> <input type="text" id="numWords"> </td>
</tr>
<tr>
<td>Number of occurances of the search character:</td>
<td><input type="text" id="numOccurance"></td>
</tr>
<tr>
<td>Display the entered text in <strong>ALL CAPS</strong>:</td>
<td> <textarea id="capsText" cols="40" rows="15"></textarea></td>
</tr>
<tr>
<td>Display the entered text with the search character <strong>removed</strong>:</td>
<td><textarea name="removeChar" id="removeChar" cols="40" rows="15"></textarea></td>
</tr>
<tr>
<td>Add the number of days in Date Modifier to the current date<br />Display the resulting date as MM/DD/YYYY:
</td>
<td> <input type="text" id="modifiedDate"> </td>
</tr>
<tr>
<td><input type="reset" id="reset" name="reset" value="Reset"></td>
<td><input type="submit" id="submit" name="submit" value="Submit"></td>
</tr>
</table>
</form>
1条答案
按热度按时间tkclm6bt1#
在您的脚本中,您似乎将removedCharText分配给removeChar,然后立即将文本区域的值重新分配给searchChar。
Removing $('# removeChar').瓦尔(searchChar); 解决您的问题