Javascript Replace Onblur - javascript

I want to replace "ı,ğ,ş" with "i,g,s".
This is my code but i cant find my fault.
And i have to do it with oblur event.
<html>
<head>
<script type="text/javascript">
function replacer()
{
var x=document.getElementById("fname");
x.value=x.value.replace("ı","i");
x.value=x.value.replace("ş","s");
x.value=x.value.replace("ğ","g");
}
</script>
</head>
<body>
Name :<input type="text" id="fname" onblur="replacer()" />
</body>
</html>

Related

Can the cursor go directly to the input when the web page is on?

I was asked to develop a web page without a mouse.
The keyboard cursor must be in the input area(example: <input id="input-label" type="text">) immediately when the page is changed.
I tried,
document.querySelector("#input-area").focus();
and
document.querySelector("#input-area").select();
It works with buttons, but does not work in DOMContentLoaded.
document.addEventListener("DOMContentLoaded", function(){
document.querySelector("#input-area").select();
});
How can I solve it?
try this, call it when dom is ready
$(document).ready(function () {
$("#input-area").focus();
});
OR
<input id="input-area" autofocus="autofocus" />
OR
$(function() {
$("#input-area").focus();
});
Try this code:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js"></script>
<script>
$(document).ready(function(){
$('#myAnchor').click(function() {
$('#mustfocus').focus();
});
});
</script>
</head>
<body>
<input type="button" id="myAnchor" value="Get focus">
<input type="text" id="mustfocus"/>
</body>
</html>
How about this one which triggers only during DOM is ready:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.js"></script>
<script>
$(document).ready(function(){
$('#mustfocus').focus();
});
</script>
</head>
<body>
<input type="button" id="myAnchor" value="Get focus">
<input type="text" id="mustfocus"/>
</body>
</html>

how to pass the values from one html page to another html page using javascript?

i am trying to pass the values from one html page to another html page but i am getting some errors..
below is my html page one code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function first() {
location.href = "onclick2.html";
}
</script>
</head>
<body>
<button onclick="first()" >Home</button>
<form action="onclick2.html" method="post">
<input type="text" name="sender" />
<input type="submit" value="send"/>
</form>
</body>
</html>
below is my html page 2 code
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function first() {
location.href = "onclick.html";
}
</script>
</head>
<body>
<button onclick="first()">Home2</button>
<form action="onclick.html" method="get">
<input type="text" name="reciver" />
</body>
you can pass value in url and transfer it as given below :
location.href = "http://www.domainname.com/login.html?FirstName=admin&LastName=admin"

How to fix display automatic 2 digits the last phone number to second textfield?

I've combined this script from http://jsbin.com/oleto5/5/edit?html,js,output and http://jsfiddle.net/AEMLoviji/tABDr/
But there is a little problem in code : $('#numbers').val($('#tt').val()+String.fromCharCode(event.keyCode));
If I remove +String.fromCharCode(event.keyCode)); and script be replaced to .substr(-2)); does not work.
If I use +String.fromCharCode(event.keyCode)); is not perfect when I remove digits.
Example :
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>berkelilingkesemua.info</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" class="jsbin" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js" type="text/javascript" class="jsbin"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js" type="text/javascript" class="jsbin"></script>
</head>
<body>
<script type="text/javascript">
$(function(){
$('#txt').keydown(function(){
setTimeout(function() {
$('#output').text($('#txt').val().substr(-2));
}, 50);
});
});
</script>
<input id="txt" type="text" />
<div id="output"></div>
<hr>
Second script is combined by me from first script becomes like below.
<hr />
<script type="text/javascript">
$(document).ready(function() {
$("#tt").keydown(function (event) {
setTimeout(function() {
}, 50);
{
$('#numbers').val($('#tt').val()+String.fromCharCode(event.keyCode));
}
});
});
</script>
<input type="text" id="tt" />
<input type="text" id="numbers" />
</body>
</html>
Are there solution about this script ?.
Let's analyze it:
1. You're using HTML5, so why not to use the "input" event? It's more reliable then a "keyup"
2. To speed things up, always try to store a DOM element in a variable, so you won't have to navigate trough all the DOM tree every time, you press a button
3. Use slice() method, to get a proper string.
var source = $("#tt"),
target = $("#numbers");
source.on('input', function() {
target.val(source.val().slice(-2));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="tt" />
<input type="text" id="numbers" />
I think you're after one of the following.
$('#output').text( $(this).val().slice(0, -2) );
$('#output').text( $(this).val().slice(-2) );
A demo using .slice():
$(function() {
$('#txt').keyup(function() {
var $this = $(this);
$('#output1').val( $this.val().slice(0, -2) ); //Grab everything but the last 2 characters.
$('#output2').val( $this.val().slice(-2) ); //Grab the last 2 characters.
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="txt" />
<br/><br/>
<input type="text" id="output1"></span><br/>
<input type="text" id="output2"></span>

How do you use data in a text field?

I want the data in the text field to transfer to a popup, but when I trigger the popup, it is always blank, no matter what is in the box.
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input type="text" name=popupMess><br>
</body>
<script>
function popup() {
window.confirm(name.popupMess);
}
</script>
</html>
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input id="popupMess" type="text"><br>
</body>
<script>
function popup() {
alert(document.getElementById('popupMess').value);
}
</script>
</html>
You forgot the " in name="popupMess".
function popup () {
var text = document.querySelector("input[name='popupMess']").value;
window.confirm(text);
}
Hi here is my jsfiddle that demonstrates the functionality
http://jsfiddle.net/7pjqfcvd/2/
you have to
mark the input element with an Id
<input type="text" id="popupMess"/>
use the id in document.getElementById call to obtain the input element
var elem = document.getElementById("popupMess");
retrieve the value from the element and pass it into the messagebox
window.confirm(elem.value);
But still if you want to use name then try this...
<html>
<head>
<title>Popup</title>
</head>
<body>
<button onclick="popup()">Click for popup</button>
<input type="text" name=popupMess><br>
<script>
function popup() {
var d = document.getElementsByName("popupMess");
window.confirm(d[0].value);
}
</script>
</body>
</html>

Simple jquery not working to print the input value

Here is a simple code which takes input and print it on the same page. But it is not working when I click on button. Please help regarding this.
<html>
<head>
<script>
function changeHTML() {
$("#withjQuery").html($("#theInput").val());
}
</script>
<body>
<input type='text' id='theInput' value='Write here' />
<input type='button' onClick='changeHTML();' value='See what you wrote with jQuery.html'/>
<div id="withjQuery"></div>
</body>
</head>
You do not have jQuery library included in the page
Add
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
ex
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
function changeHTML() {
$("#withjQuery").html($("#theInput").val());
}
</script>
</head>
<body>
<input type='text' id='theInput' value='Write here' />
<input type='button' onClick='changeHTML();' value='See what you wrote with jQuery.html'/>
<div id="withjQuery"></div>
</body>
</html>
Demo: Fiddle

Categories

Resources