jQuery: Remove string that has no parent element [duplicate] - javascript

This question already has answers here:
Remove text with jQuery
(4 answers)
How do I remove text from a node?
(2 answers)
Closed 11 months ago.
I have a document that I can't edit in PHP looking like this:
<div class="car-search-field-div">
<label class="simple_hide">Türen</label>
<div class="myClear"></div>
doors_count
<input id="car-search-form-field-doors_count" name="search[doors_count]" type="text" value="" placeholder="Anzahl Türen ab">
</div>
Now I am trying to remove the string "doors_count" via jQuery but can't adress it properly. When I try something like:
$('.car-search-field-div').remove('iventory_number', '');
The placeholder of the input field gets removed, but the string "doors_number" still is there. I also thought of using the xpath of the string, but that doesn't work either.
Is there a way to adress / remove a string that has no element wrapped around it? Thank you very much in advance!

you can remove inside all text inside .car-search-field-div
$('.car-search-field-div').contents().filter(function () {
return this.nodeType === 3;
}).remove();
more detail enter link description here
demo

You need DOM access
document.querySelector(".car-search-field-div").childNodes.forEach(node => {
if (node.nodeType === 3 && node.textContent.trim() === "doors_count") node.remove()
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="car-search-field-div">
<label class="simple_hide">Türen</label>
<div class="myClear"></div>
doors_count
<input id="car-search-form-field-doors_count" name="search[doors_count]" type="text" value="" placeholder="Anzahl Türen ab">
</div>

Related

Need to make the javascript function more refined [duplicate]

This question already has answers here:
Allow only numbers to be typed in a textbox [duplicate]
(3 answers)
Closed 5 years ago.
As the title say I've written a small code piece to detect if the entered character is a number or a letter and below is the script code.
function checkNum(i) {
//language=JSRegexp
var txt = i.value;
if (isNaN(txt)){
document.getElementById("msg").innerHTML = "Numbers only";
return false
}else{
return true
}
}
<label for="volume">Volume:</label>
<input type="text" name="volume" id="volume" size="4" onkeyup="checkNum(this)" style="margin-left:23px;">
<label for="noPl" style="margin-left: 35px;">No. of Product Lines:</label>
<input type="text" name="noPl" id="noPl" size="4" onkeyup="checkNum(this)">
<div id="msg"></div>
I tried to refine this more but when I change this it stops working for some reason.
What I want this to do is not only prompt the message but also to clear out any entered character from the text box and only allow to enter number.
At the current state it's only prompting the user not to enter letters. I did try many other mentioned methods here but none of them were successful until this.
So if can please enlighten me on what to do also keep in mind I'm still learning JavaScripting not pro yet.
$(function() {
$('#staticParent').on('keydown', '#child', function(e){-1!==$.inArray(e.keyCode,[46,8,9,27,13,110,190])||/65|67|86|88/.test(e.keyCode)&&(!0===e.ctrlKey||!0===e.metaKey)||35<=e.keyCode&&40>=e.keyCode||(e.shiftKey||48>e.keyCode||57<e.keyCode)&&(96>e.keyCode||105<e.keyCode)&&e.preventDefault()});
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="staticParent">
<input id="child" type="textarea" />
</div>
You can check
if( typeof txt == 'number' || typeof txt == 'string') {}

Repeat id of the div [duplicate]

This question already has answers here:
Get "id" and add in each div (name = "id")
(3 answers)
Closed 7 years ago.
I'm still learning, so I'm racking my brain.
$('.post-outer .post-footer .post-footer-line.post-footer-line-2 .post-labels a').each(function(index, el) {
$('.post-outer').attr('itemtype', $(this).attr('href') );
});
When you run the JS above it only takes the first "href" repeating in other "DIV". What is going on:
<div class="post-outer" id="001" itemtype="url1">test1</div>
<div class="post-outer" id="002" itemtype="url1">test2</div>
<div class="post-outer" id="003" itemtype="url1">test3</div>
I wanted to happen this:
<div class="post-outer" id="001" itemtype="url1">test1</div>
<div class="post-outer" id="002" itemtype="url2">test2</div>
<div class="post-outer" id="003" itemtype="url3">test3</div>
Here in the example it just takes the last div and repeated in other
https://jsfiddle.net/mpb9wfmc/
Using .each you can use this for the current element be iterated though:
$(this).attr('itemtype', newValueHere );
Doing $('.post-outer').attr('itemtype', $(this).attr('href') ); will apply it to all items with the class post-outer.

Checkbox value is always 'on' [duplicate]

This question already has answers here:
How do I check whether a checkbox is checked in jQuery?
(68 answers)
Closed 9 years ago.
this is my checkbox
HTML
<label class="checkbox">
<input id="eu_want_team" name="eu_want_team" type="checkbox">
</label>
JQuery
var eu_want_team = $('#eu_want_team').val();
alert(eu_want_team);
Its always displaying ON, is it checked or not. Whats the problem with it?
Use .is(':checked') instead: Working jsFiddle
var eu_want_team = $('#eu_want_team').is(':checked');
alert(eu_want_team);
or as #Itay said in comments you can use jQuery's .prop() to get the checked property value:
alert($("#eu_want_team").prop("checked"));
<label class="checkbox">
<input id="eu_want_team" name="eu_want_team" type="checkbox" value="somevalue">
</label>
<script>
var ele = document.getElementById("eu_want_team");
if(ele.checked)
alert(ele.value)
</script>
This will work :
if ($('#element').is(":checked")) {
eu_want_team = 1;
} else {
eu_want_team = 0;
}
alert(eu_want_team);
Have a quick look at this answer for checking if a checkbox is checked.
How to check whether a checkbox is checked in jQuery?
But basically you want to do something like below to check its value:
if ($("#element").is(":checked")) {
alert("I'm checked");
}
i think this is what you want to do
$("#eu_want_team").click(function(){
alert($(this).is(':checked'));
}
Try this
if ( $('#element').is(':checked')){
alert(element);
}

How can I utilize selectionStart? [duplicate]

This question already has answers here:
selectionStart-End with textareas
(2 answers)
Closed 10 years ago.
As I understood, selectionStart must return start position from selected text in input text or textarea elements
I have this js code
$("#inpt").on("mouseup" , function () {
alert( $("#inpt").selectionStart);
});
and html
<input id="inpt" type="text" value="bla bla bla" />
When I select some part in text "bla bla bla" the result is "undefined". Yell please, where did I go wrong ?
Try this.selectionStart, it's not the property of jQuery object, but the HTMLInputElement's property.
$("#inpt").on("mouseup" , function () {
console.log(this.selectionStart);
});

Unable to Limit the user input in JavaScript [duplicate]

This question already has answers here:
How to impose maxlength on textArea in HTML using JavaScript
(16 answers)
Closed 8 years ago.
I tried limiting the user input but it wasn't successful, please guide me where I am making mistake.
JS
<script type="text/javascript">
function countLength() {
var maxLength=10;
var length = document.getElementById("txt").value.length;
if(length>10) {
return false;
}
}
</script>
HTML code
<form name="formA" id="formA" action="#" >
<textarea id="txt" name="txt" onkeyup="countLength()"></textarea>
</form>
Your code basically replicates the maxlength attribute, which seems to work (and I don't think is being deprecated?). Just use that.
<input type='text' name='mytext' maxlength='10'>
return false on onkeyup does nothing (as you've probably noticed). I've seen solutions where someone would just alter the value of the textarea, perform a substring operation, and assign that new value back.
Try this:
function countLength() {
var maxLength=10;
var ta = document.getElementById("txt");
var length = ta.value.length;
if(length>maxLength) {
ta.value = ta.value.substr(0, maxLength);
return false;
}
}

Categories

Resources