We Keep Coding

How to use jQuery click not jumping to top of page

I'm using the following jQuery code for open my shop URL in a new tab windows when user click any part of page :
function getCookie(c_name) {
var i, x, y, ARRcookies = document.cookie.split(";");
for (i = 0; i < ARRcookies.length; i++) {
x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
x = x.replace(/^\s+|\s+$/g, "");
if (x == c_name) {
return unescape(y);
}
}
}
function setCookie(c_name, value) {
var exdays = 1;
var exdate = new Date();
exdate.setHours(exdate.getHours() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function checkCookie() {
var username1 = getCookie("tabligh1");
var username2 = getCookie("tabligh2");
var usernam = "sendshod";
if (username1 == null | username2 == null) {
window.open('#', '_parent', 'toolbar=1,location=1,directories=1,status=1,menubar=1?,scrollbars=1,resizable=1');
window.focus();
}
if (username1 == "" | username1 == null) {
if (window.open('http://shop.url')) {
window.focus();
setCookie("tabligh1", usernam);
}
}
}
// document.onclick = checkCookie;
jQuery(document).click(function (event) {
if (!jQuery(event.target).is('.hamyar_area, .hamyar_area *')) {
checkCookie();
}
})
if ((window.XMLHttpRequest == undefined) && (ActiveXObject != undefined)) window.onload = checkCookie;
When user click in page , a # character add end of correct URL like this:
before click : domain.com
after click : domain.com/#
And when # character add to end of URL, page jumping to top of page.
I want to use this jquery code but I don't want when user click on the page, page don't jumping to the top.

Javascript variables after refresh page

I try to create my own collapsed sidebar, and I want to have the cookie saved for settings(collapsed or expanded bar). Here`s my code from to footer included file:
var cookieRightSideBar;
var $postscontainer;
var $container;
var $infocontainer;
cookieRightSideBar = document.cookie.replace(/(?:(?:^|.*;\s*)rightside_container\s*\=\s*([^;]*).*$)|^.*$/, "$1");
$postscontainer = document.getElementById('leftside');
$container = document.getElementById('rightside_container');
$infocontainer = document.getElementById('rightside');
function collapseRightside() {
document.cookie = (cookieRightSideBar == 'collapsed') ? 'rightside_container=expanded' : 'rightside_container=collapsed';
$postscontainer.style.width = ($postscontainer.style.width == '99%') ? '80%' : '99%';
$container.style.display = ($container.style.display == 'none') ? 'block' : 'none';
$infocontainer.style.width = ($infocontainer.style.width == '0%') ? '19%' : '0%';
}
if (document.getElementById('leftside')) {
var $myheight = document.getElementById ('leftside').offsetHeight - 62;
document.getElementById('rightside').style.maxHeight = $myheight + 'px';
}
if (cookieRightSideBar == 'expanded') {
$container.style.display = 'block';
$infocontainer.style.width = "19%";
$postscontainer.style.width = "80%";
}
Its almost worked, except couple sadly things.
Then after refresh a page, I click to button for expand my bar, looks like function collapseRightside not worked correctly after first click(bar collapsed if was expanded but not expanded if was collapsed). This function properly work with any stages only after second click.
And one more... If I collaps bar, and expand again and then refresh page, the bar appear collapsed.
I understarnd what I have mistakes in logical things, but I can`t understand where?
Thanks for any help!!!

This seems to fix your problem.
https://jsfiddle.net/L5unwnL9/5/
The problem was that you were checking for $container.style.display == 'none' while that value is null on page load. This fixed it on both container and infocontainer.
I've also added createCookie and getCookie functions just because it was easier to use for me.
var cookieRightSideBar;
var $postscontainer;
var $container;
var $infocontainer;
var e = document.getElementById('onclick');
e.onclick = collapseRightside;
cookieRightSideBar = getCookie("rightside_container")
$container = document.getElementById('rightside_container');
$infocontainer = document.getElementById('rightside');
function collapseRightside() {
cookieRightSideBar = (getCookie('rightside_container') == 'collapsed') ? 'expanded' : 'collapsed';
createCookie("rightside_container", cookieRightSideBar);
$container.style.display = (!$container.style.display || $container.style.display == 'none') ? 'block' : 'none';
$infocontainer.style.width = (!$infocontainer.style.width || $infocontainer.style.width == '0%') ? '19%' : '0%';
}
if (document.getElementById('leftside')) {
var $myheight = document.getElementById('leftside').offsetHeight - 62;
document.getElementById('rightside').style.maxHeight = $myheight + 'px';
}
if (cookieRightSideBar === 'expanded') {
$container.style.display = 'block';
$infocontainer.style.width = "19%";
}
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = name + "=" + value + expires + "; path=/";
}
function getCookie(c_name) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf(c_name + "=");
if (c_start != -1) {
c_start = c_start + c_name.length + 1;
c_end = document.cookie.indexOf(";", c_start);
if (c_end == -1) {
c_end = document.cookie.length;
}
return unescape(document.cookie.substring(c_start, c_end));
}
}
return "";
}

Input file upload multiple files not working on Mobile device

I have a generic file up loader which looks like this:
<span class="input-group-btn">
<span class="btn btn-default btn-fill btn-file">
Browse<input type="file" id="fileInputs" multiple accept="image/*" onclick="resetprogresss()">
</span>
</span>
I can upload multiple files with my Desktop no problems, but When I try and use the same functionality on a mobile device, I cannot seem to select multiple files.
here is the javascript:
var Filenames;
function generateUUID() {
var d = new Date().getTime();
var uuid = 'xxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = (d + Math.random() * 16) % 16 | 0;
d = Math.floor(d / 16);
return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
});
return uuid;
};
var MainPath = generateUUID();
var Names = [];
function UploadFiles() {
var SetDir = MainPath;
var fileInputs = document.getElementById("fileInputs");
if ('files' in fileInputs) {
if (fileInputs.files.length == 0) {
alert("Please select a file");
return;
} else {
var file = fileInputs.files[0];
var ar = $("#AutoResumeBoxs").is(":checked");
var chunksize = 20000;
var name = SetDir;
/*
Arguments:
username name used to create subfolders on the server.
files files object from the file input tag.
uploadStartFunction function that receives a file object just before uploading.
progressFunction function that accepts a percent-complete integer value.
doneFunction function called when file is uploaded.
errorFunction function called when an error occurs.
chunkSize size in bytes of each chunk uploaded.
autoResume bool to control auto resuming.
*/
CFUpload(name, fileInputs.files, uploadStarts, progresss, dones, errors, chunksize, ar);
}
}
}
function uploadStarts(thisfile) {
Names.push(thisfile.name);
}
function progresss(percent) {
var p = percent + "%";
$("#lblUPs").text(p);
$("#progressbars").width(p);
$("#progressbars").attr("data-appear-progress-animation", p);
$("#ProgressTabs").text(p);
}
function resetprogresss() {
progresss(0);
}
function dones() {
}
function errors(data) {
}
function setCookie(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}
function getCookie(c_name) {
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1) {
c_start = c_value.indexOf(c_name + "=");
}
if (c_start == -1) {
c_value = null;
}
else {
c_start = c_value.indexOf("=", c_start) + 1;
var c_end = c_value.indexOf(";", c_start);
if (c_end == -1) {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start, c_end));
}
return c_value;
}
$(document).ready(function () {
$("#urls").hide();
document.getElementById("saveme").disabled = true;
var username = getCookie("username");
});
I use this library to upload the files. Any Advice would be greatly appreciated.

Well it depends on the selection method you choose on your mobile , however , my native Gallery , and file manager absloutely work fine on my mobile , just tap and hold the file you want to upload , and it will switch to multi selection mode :
Please note that there are many jQuery plugins out there to upload files like this one , so it is not necessary to use pure html input tag.

Making my javaScript popup to appear only once

I am creating a JavaScript popup. The code is as below.
The HTML:
<div id="ac-wrapper" style='display:none' onClick="hideNow(event)">
<div id="popup">
<center>
<h2>Popup Content Here</h2>
<input type="submit" name="submit" value="Submit" onClick="PopUp('hide')" />
</center>
</div>
</div>
The CSS:
#ac-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url("images/pop-bg.png") repeat top left transparent;
z-index: 1001;
}
#popup {
background: none repeat scroll 0 0 #FFFFFF;
border-radius: 18px;
-moz-border-radius: 18px;
-webkit-border-radius: 18px;
height: 361px;
margin: 5% auto;
position: relative;
width: 597px;
}
The Script:
function PopUp(hideOrshow) {
if (hideOrshow == 'hide') document.getElementById('ac-wrapper').style.display = "none";
else document.getElementById('ac-wrapper').removeAttribute('style');
}
window.onload = function () {
setTimeout(function () {
PopUp('show');
}, 0);
}
function hideNow(e) {
if (e.target.id == 'ac-wrapper') document.getElementById('ac-wrapper').style.display = 'none';
}
The jsFiddle Link:
http://jsfiddle.net/K9qL4/2/
The Issue:
The above script works fine, but I need to make the popUp to appear only once on my page.
i.e, when the user closes the popup, it should not appear until the user restarts the browser or clears his cache/cookie.
I tried using the below cookie script, but it does not work for me.
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var expDays = 1; // number of days the cookie should last
var page = "myPage.html";
var windowprops = "width=300,height=200,location=no,toolbar=no,menubar=no,scrollbars=no,resizable=yes";
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
}
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function checkCount() {
var count = GetCookie('count');
if (count == null) {
count=1;
SetCookie('count', count, exp);
window.open(page, "", windowprops);
}
else {
count++;
SetCookie('count', count, exp);
}
}
// End -->
</script>

I thing in this case is better to use localStorage instead cookie.
localStorage have a more intuitive interface and user cannot restrict
this feature to be used. I have changed your code.
function PopUp(hideOrshow) {
if (hideOrshow == 'hide') {
document.getElementById('ac-wrapper').style.display = "none";
}
else if(localStorage.getItem("popupWasShown") == null) {
localStorage.setItem("popupWasShown",1);
document.getElementById('ac-wrapper').removeAttribute('style');
}
}
window.onload = function () {
setTimeout(function () {
PopUp('show');
}, 0);
}
function hideNow(e) {
if (e.target.id == 'ac-wrapper') document.getElementById('ac-wrapper').style.display = 'none';
}
Here is working jsFiddle.
http://jsfiddle.net/zono/vHG7j/
Best regards.

To not show this untill restart browser - use local storage
localStorage.setItem("setted",true);
localStorage.getItem("setted");
FIDDLE
To not show untill clear cache\cookie use cookies
document.cookie = "setted=true";
document.cookie.indexOf("setted=true")!=-1
FIDDLE

I've used local storage instead of cookie for the reason mentioned otherwise
however, I have added the comparison, and checked that you want to show it (also added a reset button for you to test easily)
fiddle is: http://jsfiddle.net/K9qL4/8/
function PopUp(hideOrshow) {
if (hideOrshow === 'hide') {
document.getElementById('ac-wrapper').style.display = "none";
}
else if(localStorage.getItem("popupWasShown") !== "1" && hideOrshow === 'show') {
document.getElementById('ac-wrapper').removeAttribute('style');
localStorage.setItem("popupWasShown", "1");
}
}
window.onload = function () {
setTimeout(function () {
PopUp('show');
}, 1000);
}
function hideNow(e) {
if (e.target.id == 'ac-wrapper') {
document.getElementById('ac-wrapper').style.display = 'none';
localStorage.setItem("popupWasShown", "1");
}
}
document.getElementById("reset").onclick = function() {
localStorage.setItem("popupWasShown", "3");
}

We have slightly modified the code with session storage in order to load the popup whenever the page is loaded (several times per day or in a new window/tab):
else if(sessionStorage.getItem("popupWasShown") == null) {
sessionStorage.setItem("popupWasShown",1);
document.getElementById('ac-wrapper').removeAttribute('style');
}
Full code:
function PopUp(hideOrshow) {
if (hideOrshow == 'hide') {
document.getElementById('ac-wrapper').style.display = "none";
}
else if(sessionStorage.getItem("popupWasShown") == null) {
sessionStorage.setItem("popupWasShown",1);
document.getElementById('ac-wrapper').removeAttribute('style');
}
}
window.onload = function () {
setTimeout(function () {
PopUp('show');
}, 0);
}
function hideNow(e) {
if (e.target.id == 'ac-wrapper') document.getElementById('ac-wrapper').style.display = 'none';
}

**CSS:**
<style>
#popup{
display:none;
}
</style>
**HTML:**
<div id="popup">
<center>
<h2>Popup Content Here</h2>
<input type="button" name="submit" value="Submit"/>
</center>
</div>
**JS:**
<script>
getCookie = function(data){
var dset = data + "=";
var c = document.cookie.split(';');
for(var i=0; i<c.length; i++){
var val = c[i];
while (val.charAt(0)==' ') val = val.substring(1, val.length);
if(val.indexOf(dset) == 0) return val.substring(dset.length, val.length)
}
return "";
}
if(getCookie("popupShow") != "yes"){
document.getElementById('popup').style.display = "block";
//set cookie
document.cookie = 'popupShow=yes; expires=Sun, 1 Jan 2023 00:00:00 UTC; path=/'
}
</script>
Try this one it works on my end;

Javascript Bookmarklet - Gather Cookie from Browser

I'm using this as a bookmark in firefox, but when I visit the page and try to load the bookmark, it isnt doing anything. Is something wrong with my JS code?
With suggestion from user KURT, I was able to solve this by:
javascript: (function () {
function getCookie(name) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf( 'JSESSIONID' + '=');
if (c_start != -1) {
c_start = c_start + 'JSESSIONID'.length + 1;
c_end = document.cookie.indexOf(';', c_start);
if (c_end == -1) c_end = document.cookie.length;
return unescape(document.cookie.substring(c_start, c_end))
}
}
return null;
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
var thedc = readCookie("dc");
if (thedc.substring(0, 2) == 'SP') {
alert(' in SP ');
} else {
alert(' in WC ');
}
}());

You'll need to wrap it in a self invoking function.
(function() { /* Your code */ })();
Your getDC function also requires an explicit call, so this will need to be invoked.
javascript: (function () {
function getCookie(cookieName) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf( cookieName + '=');
if (c_start != -1) {
c_start = c_start + cookieName.length + 1;
c_end = document.cookie.indexOf(';', c_start);
if (c_end == -1) c_end = document.cookie.length;
return unescape(document.cookie.substring(c_start, c_end))
}
}
return null;
}
var thedc = getCookie("dc");
if (thedc.substring(0, 2) == 'SP') {
alert(' in SP ');
} else {
alert(' in WC ');
}
}());
And compressed:
javascript:(function(){function e(){if(document.cookie.length>0){c_start=document.cookie.indexOf(cookieName+"=");if(c_start!=-1){c_start=c_start+cookieName.length+1;c_end=document.cookie.indexOf(";",c_start);if(c_end==-1)c_end=document.cookie.length;return unescape(document.cookie.substring(c_start,c_end))}}return null}var t=e("dc");if(t.substring(0,2)=="SP"){alert(" in SP ")}else{alert(" in WC ")}})()