Как я могу сделать скрипт?

-1

Я хочу сделать сайт, который отслеживает количество сигарет, которые вы курите за день. Общая цель состоит в том, чтобы помочь курильщикам сократить время, достигнув поставленных целей для себя. Первой важной функцией является количество сигарет, предназначенных для курения в тот день. Второй - это кликер, который отслеживает количество сигарет, курящих в тот день.Как я могу сделать скрипт?

Вот что у меня есть:

<html> 
<head> 
    <title>SMOKERS TOOL</title> 
</head> 
<body> 

<h3>Daily goal</h3> 

<input type="number" id="myNumber" value="1"> 

<p>This is how many smokes you're having today</p> 

<button onclick="myFunction()">SUBMIT</button> 

<p id="demo"></p> 

<script> 

    function myFunction() { 
     var x = document.getElementById("myNumber").value; 
     document.getElementById("demo").innerHTML = x; 

} 
</script> 

    <script type="text/javascript"> 
    var clicks = 0; 
    function onClick() { 
     clicks += 1; 
     document.getElementById("clicks").innerHTML = clicks; 
    }; 
    </script> 
    <button type="button" style="height:200px;width:200px" onClick="onClick()">HIT ME EVERY TIME YOU SMOKE</button> 
    <p>THIS IS HOW MUCH YOU'VE SMOKED TODAY: <a id="clicks">0</a></p> 

</body> 


</html>

Я действительно новым для такого рода вещи, и у меня есть много вопросов, которые я не совсем уверен, как спросить еще, но мне было интересно, как до сделать какой-то текст, похожий на «Вы прошли по воротам!» когда количество сигарет, курящих, превышает дневную цель. Дайте мне знать, если у вас есть рекомендации. Текст SUBMIT отображается как кнопка, когда Я сохраняю его как html-файл. Я делаю все с помощью блокнота.

источник

2016-08-09 Larry Monnroe

"Как я даже JavaScript?" большой титул. Я бы рекомендовал прочитать справочный центр для получения некоторых советов и советов о том, как задавать хорошие вопросы. –

Спасибо! Я прочитал некоторые советы и советы по справочным центрам, чтобы лучше понять, что я должен задать, и я исправил свой титул, чтобы сделать его более конкретным. –

Lol. Хорошая работа. «Как я могу писать сценарий?» Вы даже пытаетесь? Это не хорошее название. Есть причина, по которой мой комментарий имеет 7 голосов. –

<html> 
    <head> 
     <title>SMOKERS TOOL</title> 
    </head> 
    <body> 

    <h3>Daily goal</h3> 

    <input type="number" id="myNumber" value="1"> 

    <p>This is how many smokes you're having today</p> 

    <button onclick="myFunction()">SUBMIT</button> 

    <p id="demo"></p> 

    <script> 

     function myFunction() { 
      var x = document.getElementById("myNumber").value; 
      document.getElementById("demo").innerHTML = x; 

    } 
    </script> 

     <script type="text/javascript"> 
     var clicks = 0; 
     var surpassedDailyGoal = false; 

     function onClick() { 
     var dailyGoal = document.getElementById("myNumber").value; 


      clicks += 1; 
      document.getElementById("clicks").innerHTML = clicks; 

     if(clicks > dailyGoal && !surpassedDailyGoal){ 
      surpassedDailyGoal = true; 
      document.body.insertAdjacentHTML('beforeend', '<p>Stop smoking you chimney you...</p>'); 
     } 
     }; 
     </script> 
     <button type="button" style="height:200px;width:200px" onClick="onClick()">HIT ME EVERY TIME YOU SMOKE</button> 
     <p>THIS IS HOW MUCH YOU'VE SMOKED TODAY: <a id="clicks">0</a></p> 

    </body>

источник

2016-08-09 20:38:02 vileRaisin

Большое вам спасибо! Камин был приятным прикосновением. –

Мне было интересно, как сделать текст похожим на «вы прошли по воротам !» когда количество сигарет, курящих, превышает дневную цель.

Вам просто нужно проверить, если clicks больше, чем ваш номер цели при выполнении вашей onClick функции.

var goal = document.getElementById("myNumber").value; 
if (clicks > goal) { 
    document.getElementById("demo").innerHTML = "You went over your goal!"; 
    //or... 
    alert("You went over your goal!"); 
}

источник

2016-08-09 20:34:29

Очень полезно. У меня есть чему поучиться –

<html> 
 

 
<head> 
 
    <title>SMOKERS TOOL</title> 
 
</head> 
 

 
<body> 
 
    <h3>Daily goal</h3> 
 

 
    <input type="number" id="myNumber" value="4"> 
 

 
    <p>This is how many smokes you're having today</p> 
 

 
    <p id="demo"></p> 
 
    <button onclick="myFunction()">SUBMIT</button> 
 

 
    <button type="button" id='btn' onClick="onClick()">HIT ME EVERY TIME YOU SMOKE</button> 
 
    <p id='disp'>THIS IS HOW MUCH YOU'VE SMOKED TODAY: 
 
    <p id="clicks">0</p> 
 
    </p> 
 
</body> 
 
<script> 
 
    function myFunction() { 
 
    var x = document.getElementById("myNumber").value; 
 
    document.getElementById("demo").innerHTML = x; 
 
    document.getElementById("btn").disabled = false; 
 
    clicks = -1; 
 
    onClick(); 
 
    } 
 

 
    var clicks = 0; 
 

 
    function onClick() { 
 

 
    clicks += 1; 
 
    if (clicks <= document.getElementById("myNumber").value) { 
 
     document.getElementById("disp").innerHTML = "THIS IS HOW MUCH YOU'VE SMOKED TODAY: "; 
 
     document.getElementById("clicks").innerHTML = clicks; 
 
    } else { 
 
     document.getElementById("clicks").innerHTML = ''; 
 
     document.getElementById("btn").disabled = true; 
 
     document.getElementById("disp").innerHTML = 'You have exceeded the limit of ' + (clicks - 1) + ' cigarettes. '; 
 
    } 
 
    }; 
 
</script> 
 

 
</html>

источник

2016-08-09 21:07:20 Ayan

Кажется, я не могу получить верхний фрагмент, который будет запущен как файл html, просто не появляясь как текст, когда я объединю два. Также я не могу представить число в ежедневной цели. Это другой формат, когда я использую блокнот и сохраняю его как html-файл, чем когда вы запускаете фрагмент кода? Я что-то упускаю? –

@LarryMonnroe Обновил фрагмент в одном разделе html. Просто поместите весь код в файл .html и откройте его в любом браузере. «Ударь меня каждый раз, когда курите», чтобы подсчитать, сколько раз курить, и увеличить/уменьшить изменение ежедневной цели и нажать кнопку «Отправить». При сбросе ежедневной цели счетчик сбрасывается. Пожалуйста, дайте мне знать в случае возникновения проблем. – Ayan

Спасибо! Удивительно, все разные способы кошки кошки в коде. –

ответ

Смежные вопросы