andy-h
1/4/2017 - 8:32 PM

Form to generate a link. Useful when you need to right-click and "Save Target As" or for making JavaScript bookmarklets.

Form to generate a link. Useful when you need to right-click and "Save Target As" or for making JavaScript bookmarklets.

<!DOCTYPE html>

<html lang="en">
<head>
	
	<meta charset="UTF-8">
	
	<title>Generate Link</title>
	
	<style type="text/css" media="all">
		body {
			padding:0.75em;
		}
		#linkList {
			margin:0 0 1em 0;
		}
	</style>
	
</head>
<body>
	
	<div id="linkList"></div>
	<form onsubmit="return genLink();">
		Address: &nbsp; <label><input type="checkbox" id="javascript"> JavaScript</label><br>
		<input type="text" id="theAddress" size="100"><br>
		<br>
		Title (optional):<br>
		<input type="text" id="theTitle" size="100"><br>
		<br>
		<input type="submit" value="Go">
	</form>
	
	<script type="text/javascript">
		function genLink(){
			
			"use strict";
			
			var list = document.getElementById("linkList"),
				addr = document.getElementById("theAddress"),
				js = document.getElementById("javascript"),
				title = document.getElementById("theTitle"),
				a = document.createElement("a"),
				href = addr.value;
			
			if(js.checked){
				if(href.slice(0, 11) !== "javascript:") href = "javascript:"+href;
				href = href.replace(/%/g, "%25");
			}
			a.href = href.replace(/"/g, "%22").replace(/'/g, "%27");
			
			a.innerHTML = (title.value || addr.value.slice(0, 100)).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
			
			list.appendChild(a);
			list.appendChild(document.createElement("br"));
			
			return false;
			
		}
		
		(function (){
			
			"use strict";
			
			var addr = document.getElementById("theAddress");
			
			addr.addEventListener("change", isJS, false);
			addr.addEventListener("keyup", isJS, false);
			
			function isJS(evt){
				if(this.value.slice(0, 11) === "javascript:"){
					document.getElementById("javascript").checked = true;
				}
			}
			
		})();
	</script>
	
</body>
</html>