【问题标题】:What should i change the formula in Javascript?我应该如何更改 Javascript 中的公式?
【发布时间】:2015-06-12 06:56:25
【问题描述】:

我正在使用 HTML5 和 JS 开发一个速读模拟。

但是,我无法理解客户的期望。

我已将以下内容用于该应用程序。

$('#sim').each(function () {
    this.contentEditable = true;
});

var go = $('#go');
var stop = $('#stop');
var wordCount = 0;
var wordCountBox = $('#wordCountBox');
var timepassed = $('#timepassed');
var textRead = $('#textRead');


go.on("click", function (e) {
    e.preventDefault();
    startSim();
});

function startSim() {
    var speed = $('#speed').val();
    var boldWords = speed / 60;
    boldWords = boldWords < 1 ? 1 : Math.round(boldWords);
    timeStart = $.now();
    var sim = $('#sim').text();
    var wordArray = sim.split(/[\s]+/);
    var simWrap = $('#sim');

    var arrCount = wordArray.length;
    var alreadyRead = [];

    for (var i = 0; i < arrCount; i++) {
        (function (index) {
            setTimeout(function () {
                var pos = index;
                if (pos < 0) {
                    pos = 0;
                }
                alreadyRead.push(wordArray[pos]);
                wordArray[pos] = '<span class="grayx">' + wordArray[pos] + '</span>';
                if (pos > (boldWords - 1)) {
                    wordArray[pos - boldWords] = wordArray[pos - boldWords].replace("x", "dim");
                }
                var words = wordArray.join(" ");
                simWrap.html(words);
                wordCount++;
                if (pos == (arrCount - 1)) {
                    triggerDone();
                }
                $('#sim span:last')[0].scrollIntoView(false);
            }, i * speed);
        })(i);
    }
    // Function done
    function triggerDone() {
        wordCountBox.text(wordCount + ' Words Read');
        var timeEnd = $.now();
        var timeRes = timeEnd - timeStart;
        timeRes = parseInt(timeRes);
        timeRes = timeRes / 1000;
        timepassed.text(" in " + timeRes + " Seconds.");
        alreadyRead = alreadyRead.join("");
        textRead.text(alreadyRead);
        var summary = $('#summary');
        summary.show();
        return;
    }
    stop.on("click", function (e) {
        e.preventDefault();
        triggerDone();
    });
}
#sim {
    width:800px;
    height:400px;
    border:solid 1px #2e2e2e;
    color:black;
    padding:5px;
    overflow-y:scroll;
    border:9px outset #0ADA0A;
    margin-top:1em;
    font-size:16pt;
    text-align:left;
    background-color:white;
    column-count: 2;
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap : 20px;
    -moz-column-rule-color: #ccc;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 1px;
    -webkit-column-rule-color: #ccc;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 1px;
}
button{
    padding:10px 25px;
    color:#fafafa;
    transition:all 0.3s;
    cursor:pointer;
}
#go{
    background-color:#46A111;
    border:solid 1px #46A111;
}
#go:hover{
    background-color:#fafafa;
    color:#46A111;
}
#stop{
    background-color:#A11111;
    border:solid 1px #A11111;
}
#stop:hover{
    background-color:#fafafa;
    color:#A11111;
}
.summary{
width:350px;
height:30px;
margin-left:12em;
    background-color:rgba(0,0,0,0.1);
    border:solid 1px #2e2e2e;
    padding:5px;
    margin-top:10px;
    display:none;
    border-radius: 45px;
    background: #8AC007;
    padding: 5px;   
    
    
}
#bold{
    font-weight:bold;
}
.grayx {
    font-weight: 600;
}
.graydim {
    color: dimgray;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div class="summary" id="summary">
                    <span id="wordCountBox"></span>
                    <span id="timepassed"></span>                    
                </div>
<button id="go">START</button>
        <button id="stop">STOP</button>
<input id="speed" type="number" value="120" step="10" min="0" max="1000"/>
                <span for="speed">WPM</span>
<div id="sim" cols="2" rows="2"></div>

http://jsfiddle.net/Darious/dcu808w1/

更新

但我的客户想要

带有两个字光标。 1200 除以二:600 字。

600 字除以 60 秒

那是 10 分钟

对吗?

带有三字光标。

1200 格除以 3 = 400 字

400 格乘以 60 秒 = 6.66 分钟。

当你开始工作时。您可以为光标时间添加一个按钮 速度。

前 1 秒

然后 0.5 秒

现在。值是:

.25, .5, .75, 1, 1.25, 1.50, 2

真的,我不知道,我应该对此进行什么更改?

【问题讨论】:

  • @humble.rumble 这与随机无关。
  • @humble.rumble 这取决于您对 variable 的定义。通过阅读这篇文章的其余部分,您可以发现所需的行为取决于一个固定的公式,将字数和阅读速度作为输入。它与随机性无关。
  • 或更简单的说法:variable != random
  • 帮我解释一下。
  • 您似乎在尝试获取SO to do your work for you。如果您不能满足客户的要求,也许是时候告诉他们了。

标签: javascript jquery html css


【解决方案1】:

我唯一能想到的是:

boldWords = boldWords < 1 ? 1 : Math.floor(boldWords);

在所描述的情况下返回 1(其中 boldWords~1.67 开头),但根据您客户的意愿,他预计结果为 2。 只需将其更改为

boldWords = boldWords < 1 ? 1 : Math.round(boldWords);

(或使用Math.ceil,不知道任何进一步的要求,以及是否适合他们)

【讨论】:

  • 帮我简单解释一下。
  • 您的公式似乎工作正常,但您可能以错误的方式舍入了结果。
  • 感谢@Timothy Groote。
猜你喜欢
  • 2014-05-08
  • 2019-09-28
  • 1970-01-01
  • 1970-01-01
  • 2014-07-07
  • 2010-10-18
  • 1970-01-01
  • 1970-01-01
  • 2021-01-07
相关资源
最近更新 更多