Delete Last Char of String with Javascript
I have a DIV with some characters. How can I r开发者_JAVA百科emove the last character from the text with each click on the DIV itself?
Removing First Character
$("div").on("click", function(){
$(this).text(function(index, text){
return text.replace(/^.(\s+)?/, '');
});
});
Removing Last Character
$("div").on("click", function(){
$(this).text(function(index, text){
return text.replace(/(\s+)?.$/, '');
});
});
Removing a Specific Char
$("div").on("click", function(){
$(this).text(function(index, text){
return text.replace(/r/gi, '');
});
});
See an example of each online at: http://jsfiddle.net/Xcn6s/
Assuming you have a reference to the div and it just contains a single text node (as your question implies), this is very simple. Here's a non-jQuery solution:
div.onclick = function() {
var textNode = this.firstChild;
textNode.data = textNode.data.slice(0, -1);
};
Edit: here's the easiest way to do this without any library dependencies
function removeLastChar(node) {
var i = node.childNodes.length;
while (--i >= 0) {
if (3 === node.childNodes[i].nodeType) {
node.childNodes[i].data = node.childNodes[i].data.replace(/\S\s*$/, '');
break;
}
}
}
/\S\s*$/ still means "the last non-space at the end"
Note: borrowed from Tim Down's solution and further years of web development experience, :)
Alternative to Jonathan's answer, how to delete the first character:
$("div.myDiv").click(function(){
$(this).html($(this).text().substring(1));
});
Or, remove the last character:
$("div.myDiv").click(function(){
$(this).html($(this).text().replace(/.$/g, ''));
});
Or, go crazy and remove a character from a random place:
$("div.myDiv").click(function(){
var text = $(this).text();
var index = Math.round(Math.random() * (text.length - 1));
var result = text.substring(0, index) + text.substring(index + 1, text.length - 1);
$(this).html(result);
});
Instead of random place, you can use the above function with a predefined index to remove from a specific location.
This deletes a character each time you click on the div. Without more requirements, I can't give you any more.
<html>
<head>
<script>
function deleteChar(div) {
div.innerHTML = div.innerHTML.replace(/.$/, '');
}
</script>
</head>
<body>
<div onclick="deleteChar(this)">this is my div</div>
</body>
</html>
Oh, sorry, you asked for jquery... Well, this is how you do it in straight javascript.
If you wanted to delete the first character of the text every click you could use substring. e.g.:
$("#textDiv").click(function(){
$(this).html($(this).text().substring(1));
});
To supplemnt on Jonathons answer, use..
$("div.myDiv").click(function(){
$(this).html( $(this).text().replace("/.$/gi", "o") );
});
To remove the last character
Plain JavaScript:
<div id="text">This is some text</div>
<script>
var node = text.firstChild;
var nodeValue = "";
var nodeValueLength = 0;
text.onclick = function () {
nodeValue = node.nodeValue;
node.nodeValue = nodeValue.substring(0, nodeValue.length - 1);
};
</script>
Its easy by using the attribute$= CSS3 selector which means "ends with" in your jQuery selection:
To Delete 1st character:
$("div[id$=/]").each(function(){
this.id = this.id.substr(1);
});
To Delete Last Character:
$("div[id$=/]").each(function(){
this.id = this.id.substr(0,this.id.length - 1);
});
加载中,请稍侯......
精彩评论