Develop Reference

JavaScript, Print Screen and copy and paste

I got some code from the internet, below, and used it in a mock exam application I am doing. This is suppose to prevent people from Printing Screen, copying or cutting from the exam page. The code works perfectly well in Internet Explorer but does not work in the other browsers. I need help to make the code below work in the other browsers to avoid cheating at the site during mock exam. Below is the code:
<script type="text/javascript">
function AccessClipboardData() {
try {
window.clipboardData.setData('text', "No print data");
} catch (err) {
txt = "There was an error on this page.\n\n";
txt += "Error description: " + err.description + "\n\n";
txt += "Click OK to continue.\n\n";
alert(txt);
}
}
setInterval("AccessClipboardData()", 300);
document.onkeydown = function (ev) {
var a;
ev = window.event;
if (typeof ev == "undefined") {
alert("PLEASE DON'T USE KEYBORD");
}
a = ev.keyCode;
alert("PLEASE DON'T USE KEYBORD");
return false;
}
document.onkeyup = function (ev) {
var charCode;
if (typeof ev == "undefined") {
ev = window.event;
alert("PLEASE DON'T USE KEYBORD");
} else {
alert("PLEASE DON'T USE KEYBORD");
}
return false;
}

Please know that it is entirely impossible to prevent users from copying or screencapping your site from javascript, seeing how they could simply disable js or your function in particular as has been mentioned in the comments already.
If you simply want to discourage people as much as possible you can still use your code, however window.clipboardData.setData only works in IE so it is not strange you would get an error message in other browsers, for thos you would have to use execCommand to copy a set message to the clipboard at you set interval
documnet.execCommand(delete, false, null)
to delete the current selection and then
documnet.execCommand(copy, false, null)
to copy the currently selected text(which you just made sure was nothing)
(for more info on execCommand https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand)
this should work in Firefox, Safari and Chrome, I know of no way to do this in Opera, as neither command will work in that browser
Note however that this will keep overwritting your clipboard as long as the site is open in the browser, so even if someone tried to copy something else entirely they would be unable.
I would like to point out that I provide this function only to show you what the problem with your code, as you will never be able to do what you want to completely without getting people to install third party rights management software on their computer.

I find the following code at Stackoverflow here, by iDhavalVaja and it worked fine.
<script type="text/javascript">
$(function () {
$(this).bind("contextmenu", function (e) {
e.preventDefault();
});
});
</script>
<script type="text/JavaScript">
function killCopy(e) { return false }
function reEnable() { return true }
document.onselectstart = new Function("return false");
if (window.sidebar) {
document.onmousedown = killCopy;
document.onclick = reEnable;
}
</script>

If you just want to get this working in other browsers, maybe use jQuery (something like this):
$(document).keydown(function (e) {
alert("PLEASE DON'T USE KEYBORD");
});

Jquery - detect and get the url from text using jquery

I have textarea and I want to detect when the user will finish TYPING or PASTING a url. I want to catch that url an send it to php.
I looked at many solutions from google, but they all seems to add a anchor tag around the link which I don't want to do.
I tried using this regexp I found in a solution on this website, but it did not work:
/(ftp|http|https):\/\/(\w+:{0,1}\w*#)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%#!\-\/]))?/
the problem with it is that as soon I type something like http://, it will automatically send that string only.
I don't want to write a regexp with finite list of TLDs. What ways can I archive this?
this is the code:
$(document).ready(function() {
$('#write-post-textarea').keyup(function() {
if(isUrl($(this).val())){
//Show the url in an alert box
alert($(this).val());
}else{
//do something if its not a url
}
});
function isUrl(s) {
//var regexp = /(ftp|http|https):\/\/(\w+:{0,1}\w*#)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%#!\-\/]))?/
return regexp.test(s);
}
});

Use keyup event along with keycode validation to make sure enter or space button pressed before start validation.
$("#write-post-textarea").keyup(function (e) {
if (e.which == 13 || e.which == 32) { // 32 may be for space bar click
if(isUrl($(this).val())){
//Show the url in an alert box
alert($(this).val());
}else{
//do something if its not a url
}
}
});

I think the problem you have is that whenever you press a key it checks url once. So as soon as you type in something that matches the regexp it sends. You can try set a timer like this:
var timer;
$(document).ready(function() {
$('#write-post-textarea').keyup(function() {
var $this = $(this);
clearTimeout(timer);
setTimeout(function ()}
if(isUrl($this.val())){
//Show the url in an alert box
alert($(this).val());
}else{
//do something if its not a url
}
}, 2000);
});
function isUrl(s) {
//var regexp = /(ftp|http|https):\/\/(\w+:{0,1}\w*#)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%#!\-\/]))?/
return regexp.test(s);
}
});
So that timer will be clear when you are typing, and only run the code when you stop.

Conditional onbeforeunload event in a page

window.onbeforeunload = function(evt) {
var message = 'Are you sure you want to leave the page. All data will be lost!';
if (typeof evt === 'undefined') {
evt = window.event;
}
if (evt && !($("#a_exit").click)) {
evt.returnValue = message;
}
return message;
};
I want user to leave the page clicking to the link (has id ="a_exit") only. In other circumstances such as refreshing the page, clicking another link, user will be prompted that if he/she wants to leave the page. I have tried to use the code above. It still asks me if I want to go away when I click the exit link.

$(window).bind('beforeunload',function() {
return "'Are you sure you want to leave the page. All data will be lost!";
});
$('#a_exit').live('click',function() {
$(window).unbind('beforeunload');
});
Above works for me

My quick example of the conditional prompt before leaving page:
window.onbeforeunload = confirmExit;
function confirmExit(event) {
var messageText = tinymce.get('mMessageBody').getContent();
messageText = messageText.trim();
// ... whatever you want
if (messageText != "")
return true;
else
return void (0);
};
It works under Chrome, FF.

You can return null when you do not want the prompt to show. Tested on Chrome 79.
window.onbeforeunload = () => {
if(shouldPrompt){
return true
}else{
return null
}
}
BTW modern browser no longer support custom onBeforeUnload promp text.

It will always prompt you if you want to leave the page. It's a security issue and cannot be worked-around.
Moreover, anything you return in the onbeforeunload event handler that is not void will be treated as the message for the prompt. Refer to this article: https://developer.mozilla.org/en-US/docs/Web/API/Window.onbeforeunload

This worked for me.
window.onbeforeunload = function(){
if(someBoolean) {
return 'message'
}else{
window.onbeforeunload = null;
}
}

You could just remove window.onbeforeunload in the click handler.

How about a variable to decide, if the link was clicked?
var exitClicked = false;
$("#a_exit").click(function() {
exitClicked = true;
});
window.onbeforeunload = function(evt) {
//...
if(evt && !exitClicked) {
evt.returnValue = message;
}
//...
};
You only set exitClicked = true when the link was really clicked and afterwards, before unloading you can simply check this variable.

This is quite old but I wanted just to change the code given that .live is no longer working in Jquery. So, the updated version would be:
$(window).bind('beforeunload',function() {
return "'Are you sure you want to leave the page. All data will be lost!";
});
$('#a_exit').on("click", function(){
$(window).unbind('beforeunload');
});

Enter in search box and redirect to another page

// catch enter code in search form in front page
$('#search').keypress(function (e) {
var str = $('#search').val();
var url = "default.aspx?search=" + str;
if (e.keyCode == 13) {
location.href = url;
}
});
I don't know why this code doesn't work what I expected " When you enter something in input#search, check if it's not empty then redirect to another page ". I try to enter every line in console without checking event, it works!
How can I fix this and why it doesn't work ? Thanks for your consideration time :)

You might try .keyup() instead of .keypress(). Keypress is not an official specification, and can have unfortunate consequences in some browsers.

Put your domain including http for location href to work correctly
// catch enter code in search form in front page
$('#search').keypress(function (e) {
var str = $('#search').val();
var domain = "http://www.yourdomain.com";
var url = domain+"default.aspx?search=" + str;
if (e.keyCode == 13) {
location.href = url;
}
});

simple jquery on asp.net does not work on firefox

I have been struggling with getting this work on Firefox. Hope there is somebody help me!
Basically; Firefox ignores the button click function and it's sub functions and the button posts the page instead of running the jquery code.
It works on IE and Chrome but not on Firefox.
Thank you for your help in advance.
Here is the output code:
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$(".CatList li").click(function() {
if ($(this).is(".selected")) {
$(this).attr("class", "");
$('#ctl00_ContentPlaceHolderRight_CatChanged').val(1);
return false;
}
else {
$(this).attr("class", "selected");
$('#ctl00_ContentPlaceHolderRight_CatChanged').val(1);
return false;
}
});
$("#ctl00_ContentPlaceHolderRight_btnSave").click(function() {
var elements = $("li.selected");
if (elements.val() == null) {
alert("You must select at least one category");
return false;
}
else {
elements.each(function() {
$('#ctl00_ContentPlaceHolderRight_CatChecked').val($('#ctl00_ContentPlaceHolderRight_CatChecked').val() + "," + $(this).attr("id"));
return true;
});
}
});
});
</script>

Do you know firebug Firefox Extension? It is very useful for debug Javascript on Firefox.
Firebug also include a Javascript console where you can test your functions.

Don't check against null -- try to stick with the undefined that jQuery ensures. Check what elements.val() returns to start (just alert it).
Also, you don't preventDefault() or return false in the else clause which could be a reason for Firefox to submit the page.

Thank you tjko, using alert saved my day. I was just too confused. I have changed the code as below and everything works perfectly:
var elements = $("li.selected");
elements.each(function() {
$('#<%=CatChecked.ClientID%>').val($('#<%=CatChecked.ClientID%>').val() + "," + $(this).attr("id"));
});
if ($('#<%=CatChecked.ClientID%>').val() == "") {
alert("You must select at least one category");
return false;
}
else {
//alert($('#<%=CatChecked.ClientID%>').val());
return true;
}