Develop Reference

How to remove space character in mobile view

<script>
$(function() {
$('#name').on('keypress', function(e) {
if (e.which == 32)
return false;
});
$('#email').on('keypress', function(e) {
if (e.which == 32)
return false;
});
$('#phone').on('keypress', function(e) {
if (e.which == 32)
return false;
});
$('#location').on('keypress', function(e) {
if (e.which == 32)
return false;
});
});
</script>
This is my JS to remove Space Character, but its not support to mobile view.
Can anyone help,
Thanks in Advance.

D3 on keyboard event return hyperlink

I'm trying to do a kind of "key navigation" on my website: if it's pressed left_arrow, I return to the previous page and if it's pressed right_arrow i go to next page. I've done this, the "console.log("keydown")" works, but the function returns don't.
d3.select("body")
.on("keydown", function(e) {
console.log("keydown");
//return "line_chart.html";
if(e == 37) { // left
console.log("left");
return "line_chart1.html";
}
else if(e == 39) { // right
console.log("right");
return "line_chart2.html";
}
});

Instead of
.on("keydown", function(e) { //e is coming UNDEFINED
console.log("keydown");
//return "line_chart.html";
if(e == 37) { // left i found e as undefined
I got the keycode using d3.event.keycode and it worked something like below:
d3.select("body")
.on("keydown", function(e) {
console.log("keydown");
//return "line_chart.html";
if(d3.event.keycode == 37) { // left
console.log("left");
return "line_chart1.html";//this return will not do anything
}
else if(d3.event.keycode == 39) { // right
console.log("right");
return "line_chart2.html";//this return will not do anything
}
});
EDIT
d3.select("body")
.on("keydown", function(e) {
console.log("keydown");
//return "line_chart.html";
if(d3.event.keyCode == 37) { // left
console.log("left");
SOME_FUNCTION("line_chart1.html");
}
else if(d3.event.keyCode == 39) { // right
console.log("right");
SOME_FUNCTION("line_chart2.html");
}
});

Perform an action on both click and keydown (Left & Right) arrow keys

I have a dashboard page that has a left pane which slides on click. I want to make the same thing happen on pressing the Left Arrow and the Right Arrow keys.
Can anybody help me on this? I could do it on click. Below is my solution:
$(document).ready(function() {
$('#opener, .left-panel-head').on('click', function() {
var panel = $('#LeftPanel');
if (panel.hasClass("visible")) {
panel.removeClass('visible').animate({'margin-left': '-300px'});
$('#rightPanel').animate({'width': '100%'});
} else {
panel.addClass('visible').animate({'margin-left': '0px'});
$('#rightPanel').animate({'width': '74%'});
}
return false;
});
});

function updatePanel(direction) {
if(direction === 'left') {
// pressing left
}else if(direction === 'right') {
// pressing right
}
};
$(document).keypress(function( event ) {
if(event.which == 37) {
updatePanel('left');
}else if(event.which == 39) {
updatePanel('right');
}
};
$('#opener, .left-panel-head').on('click', updatePanel('left'));
$('#opener, .right-panel-head').on('click', updatePanel('right'));

You can make your function an actual function instead of an anon function passed into your click event and then call it from multiple places.
(function($, document){
var $document = $(document);
//shared function
function stuff(){
}
//check if key pressed was one of the left or right arrows
function checkKey(e){
var c = e.which ? e.which : e.keyCode;
//left arrow, right arrow
if(c === 37 || c === 39){
//call stuff if left or right arrow was pressed
stuff();
}
}
//call stuff on click
$('#opener, .left-panel-head').on('click', stuff);
$document.on('keydown', checkKey);
})(jQuery, document);

Jquery Tab panel to get focus on key press

I have a jquery tab panel. This panel contains some user controls like textboxes. My requirement is to set focus on tab when I press Shift+T. This is not happening. I have used the following code.
<script type="text/javascript">
$(document).ready(function () {
$("#tabs").keypress(function () {
if (e.keyCode == 80 && e.keyCode == 18)
$("#tabs").focus();
});
$("#tabs").focus(function () {
if (e.keyCode == 37) {
selected = (selected - 1);
$('#tabs').tabs('option', 'selected');
}
if (e.keyCode == 39) {
selected = (selected + 1);
$('#tabs').tabs('option', 'selected');
}
});
});
</script>

I am not sure why you need to complicate it.
Try this demo:
http://jsfiddle.net/lotusgodkk/GCu2D/417/
JS:
$(document).ready(function () {
$(document).on('keydown', function (e) {
var keyCode = e.keyCode;
if ((keyCode == 84) & (e.shiftKey)) {
$('.ui-state-active:visible:first').focus(); //ui-state-active is the class of active tab.
}
});
$('#tabs').tabs();
});

you should try this:
inputs = $("table :input");
$(inputs).keypress(function(e){
if (e.keyCode == 13){
inputs[inputs.index(this)+1].focus();
}
});

i guess might be work for u Click Here
js
$("#status").keydown(function (e) {
if (e.which == 9) {
$("#statuses").html(this.value);
this.value = "";
$("#status").focus();
e.preventDefault();
}
});

first -> remove double qoutes .. they are used for components like input, p etc.
second -> try this code..
$(document).ready(function () {
$('#tabs').keypress(function () {
if (e.keyCode == 80 && e.keyCode == 18)
$('#tabs').focus(); // setting the focus
alert("working"); //test it
});
$('#tabs').focus(function () {
if (e.keyCode == 37) {
selected = (selected - 1);
$('#tabs').focus(); // setting the focus
$('#tabs').tabs('option', 'selected');
}
if (e.keyCode == 39) {
selected = (selected + 1);
$('#tabs').tabs('option', 'selected');
}
});
});
</script>

javascript prevent scrolling

I am trying to prevent scrolling when I use arrow keys in my HTML5 game. It is a maze game that you control with arrow keys or buttons on the screen, but whenever I press the 'up' or 'down' keys, it always scrolls.I am using:
document.addEventListener('keydown', function(e){
if(e.keyCode === 40) {
down();
} else if(e.keyCode === 38) {
up();
} else if(e.keyCode === 37) {
leftclick();
} else if(e.keyCode === 39) {
rightclick();
}
})
Is this possible with javascript? I want it to be able to scroll with my mouse, but not when I use arrow keys on my keyboard. My game is at http://thomaswd.com/maze. Please help. Thanks!

Use e.preventDefault() to prevent the normal key action from taking place.
document.addEventListener('keydown', function(e){
if(e.keyCode === 40) {
down();
e.preventDefault();
} else if(e.keyCode === 38) {
up();
e.preventDefault();
} else if(e.keyCode === 37) {
leftclick();
e.preventDefault();
} else if(e.keyCode === 39) {
rightclick();
e.preventDefault();
}
})

Try this:
document.addEventListener('keydown', function(e) {
if(e.keyCode > 36 && e.keyCode < 41) {
e.preventDefault();
}
if (e.keyCode === 40) {
down();
} else if (e.keyCode === 38) {
up();
} else if (e.keyCode === 37) {
leftclick();
} else if (e.keyCode === 39) {
rightclick();
}
return false;
}, false);
}

Try to add e.preventDefault(); at the end