Pausing a stopwatch does not stop the time

Question

I think you should use .performance.now() if you want something close to accurate in terms of ms.

Thought you had an interesting problem so I came up with a solution of my own for fun. Hope it helps. :) (UPDATES BELOW THE CODE)

http://jsfiddle.net/colbycallahan/CjDz7/1/ (cleaned it up a bit for display and rounding a bit)

Works and Requires jQuery:

HTML:

<div id="console"></div>
<input type="button" id="btn" value="start time">
<input type="button" id="btn2" value="stop time">

js:

var timerRunning = false;
var startTime;
var totalTime;
$('#console').data('totalTime', 0);

function startTimer(){
    totalTime = $('#console').data('totalTime');
    startTime = window.performance.now();
    timerRunning = true;

    function timerLoop(){
        window.setTimeout(function(){
            if(timerRunning){
                $('#console').text(window.performance.now() - startTime + totalTime);
                timerLoop();
            }
        }, 50);
    }

    timerLoop();    
}

$('#btn').on('click', function(){
    startTimer();
});

$('#btn2').on('click', function(){
    totalTime = window.performance.now() - startTime + totalTime;
    $('#console').data('totalTime', totalTime);
    timerRunning = false;
});

I took your code and the first thing I did was fix what can possibly cause errors in terms of syntax regarding curly braces on separate lines from if statement, missing semicolon in the if statement for when running state is 0, one semicolon incorrectly placed in timecounter() call. You tried to call a function by making it a string, but strings never call functions. starttime is not defined before you pass it as an argument to timecounter(). Your settimeout() line should be set up outside the condition statement to call it. You unnecessarily call an else if running state is not 1. lapdate is not defined other than to make it empty string. Also refresh is not defined unless running state is 1, but is only called when refresh does not equal 1. Lastly you did not include all of the code necessary to know if additional mistakes were made nor is there enough code to know if what I rewrote will fix your issue, which is why I wrote new code(it requires jquery library to be included on your page). I don't really understand the logic of your code. One more thing: you will need to retrieve the stored value of elapsed time after a user has started timer, clicked pause, and then resumed the timer. As a thanks, you should go to JSLint.com or similar and never run your code in a browser until it passes a lint test. I am only reposting your code at the bottom and don't expect it to work. I redid my timer in vanilla javascript with no jquery required. It is here:

Works and Requires no jQuery:

<!DOCTYPE html>
<html>
<head> 
</head>
<body>

    <div id="console"></div>
    <input type="button" id="btn" value="start time" onclick="startTimer();">
    <input type="button" id="btn2" value="stop time" onclick="stopTimer();">
    <input type="hidden" id="storedTime" value="0">

<script>
    var timerRunning = false;
    var startTime;
    var totalTime;
    var storedTimeInp = document.getElementById('storedTime');
    var console = document.getElementById('console');

    function startTimer(){
        totalTime = Number(storedTimeInp.value, 10);
        startTime = window.performance.now();
        timerRunning = true;

        function timerLoop(){
            window.setTimeout(function(){
                if(timerRunning){
                    console.innerHTML = (window.performance.now() - startTime + totalTime);
                    timerLoop();
                }
            }, 50);
        }

        timerLoop();    
    }    

    function stopTimer(){
        totalTime = window.performance.now() - startTime + totalTime;
        storedTimeInp.value = totalTime;
        timerRunning = false;
    }   


</script>
</body>
</html>

Your Code Rewritten Kinda(broken):

var runningstate = 0;

function timecounter(starttime){
  currentdate = new Date();
  details = document.getElementById('details');
  stopwatch = document.getElementById('stopwatch');

  var timediff = currentdate.getTime() - starttime;

  setTimeout(
    if(runningstate == 0){
      timediff = timediff + stoptime;
    }else{
      stopwatch.value = formattedtime(timediff);
      timecounter(starttime);
      stoptime = timediff;
    }  
  ,10);
}

function startandstop(){
  var startandstop = document.getElementById('startandstopbutton');
  if(runningstate==0){
    startandstop.value = 'Pause';
    runningstate = 1;
    starttime = new Date();
    starttime = starttime.getTime();
    timecounter(starttime);
  }else{
    startandstop.value = 'Start';
    runningstate = 0;
    lapdate = '';
  }
}