Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/424.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
获取javascript以基于文本字段显示div_Javascript_Html_Javascript Events - Fatal编程技术网

获取javascript以基于文本字段显示div

获取javascript以基于文本字段显示div,javascript,html,javascript-events,Javascript,Html,Javascript Events,嘿,大家好,我一直在处理这个javascript文件,这样当有人输入更多文本时,他们会看到一个不同的div向他们显示一段代码(很快就会成为paypal按钮) 由于某种原因,我不能让女主角出现。我同时使用了onchange和onkeyup,两者似乎都没有帮助。下面是代码: <br/>Word Count: <input type="text" id="c" name="c" value="311" size="5" onkeyup="cnt(document.script.w,t

嘿,大家好,我一直在处理这个javascript文件,这样当有人输入更多文本时,他们会看到一个不同的div向他们显示一段代码(很快就会成为paypal按钮)

由于某种原因,我不能让女主角出现。我同时使用了onchange和onkeyup,两者似乎都没有帮助。下面是代码:

<br/>Word Count: <input type="text" id="c" name="c" value="311" size="5"
onkeyup="cnt(document.script.w,this)" onchange="showDiv()"/>
</form>

<div id="div1" style="display:none">
Price level 1!
</div>

<div id="div2" style="display:none">
Price level 2!
</div>

<div id="div3" style="display:none">
Price level 3!
</div>

<div id="div4" style="display:none">
Price level 4!
</div>

<div id="div5" style="display:none">
Price level 5!
</div>

<div id="div6" style="display:none">
Price level 6!
</div>

<div id="div7" style="display:none">
Price level 7!
</div>

字数: 价格一级! 价格等级2! 价格等级3! 价格等级4! 价格等级5! 价格等级6! 价格等级7!
剧本

function showDiv() {
    var myNumValue = document.getElementById('c').value;
    var myNum = parseInt(myNumValue);
    var price1=0;
    var price2=100;
    var price3=200;
    var price4=300;
    var price5=400;
    var price6=500;
    var price7=600;

    if (myNum >= price1 && myNum <= price2) {
        document.getElementById('div1').style.display = 'block';
    }
    elseif(myNum >= price2 && myNum <= price3) {
        document.getElementById('div2').style.display = 'block';
    }
    elseif(myNum >= price3 && myNum <= price4) {
        document.getElementById('div3').style.display = 'block';
    }
    elseif(myNum >= price4 && myNum <= price5) {
        document.getElementById('div4').style.display = 'block';
    }
    elseif(myNum >= price5 && myNum <= price6) {
        document.getElementById('div5').style.display = 'block';
    }
    elseif(myNum >= price6 && myNum <= price7) {
        document.getElementById('div6').style.display = 'block';
    }
    else {
        document.getElementById('div7').style.display = 'block';
    }
}
函数showDiv(){
var myNumValue=document.getElementById('c').value;
var myNum=parseInt(myNumValue);
var-price1=0;
var价格2=100;
var价格3=200;
风险价值4=300;
风险价值5=400;
var价格6=500;
风险价值7=600;

如果(myNum>=price1&&myNum=price2&&myNum=price3&&myNum=price4&&myNum=price5&&myNum=price6&&myNum在
elseif
之间留一个空格可能会有帮助
elseif
如果
elseif
的话,阿穆拉指出的问题是你的普遍问题,但我也想提出一些建议t使用元素ID数组而不是
if
s和
else if
s的替代方法。例如:

function showDiv() {
    var myNumValue = document.getElementById('c').value,
        myNum = Math.min(Math.floor(parseInt(myNumValue, 10) / 100), 6),
        myDiv = ["div1", "div2", "div3", "div4", "div5", "div6", "div7"][myNum];

    document.getElementById(myDiv).style.display = "block";
}
更整洁,对吗?现场示例::-)

但是,请注意,这并不完全相同。在您的示例中,如果值为300,则将显示div3。在我的示例中,将显示div4(我认为这更可能是您所需要的)。如果您希望在代码中使用div4,则可以在解析后从
myNumValue
中减去0到0.1之间的任何值(在除以100之前)得到与代码相同的结果


另外,这可能是您真正想要的:。

您可以根据输入更改一个特定div的内容,而不是有多个div。类似

<br/>Word Count: <input type="text" id="c" name="c" value="311" size="5"
onkeyup="showDiv()" onchange="showDiv()"/>
</form>

<div id="priceInfo">
    Enter Price
</div>

字数: 输入价格
JS

函数showDiv(){
var myNumValue=document.getElementById('c').value,
myNum=parseInt(myNumValue),
pricefind=false;
var价格银行={
“价格级别1!”:0,
“价格水平2!”:100,
“价格水平3!”:200,
“价格水平4!”:300,
“价格水平5!”:400,
“价格水平6!”:500,
“价格水平7!”:600
}
for(priceBank中的var价格){

if(myNum)我在代码的开头添加了一个

,纯粹是为了让代码格式化程序将您的代码识别为HTML。这对任何可能的答案都没有影响。顺便说一句,为了可读性,您可能想去掉if/else中的大括号(或者只放第一个
{
if(…)
在同一行,就像您为
函数showDiv()所做的一样{
)谢谢!这太棒了!我感谢您的帮助!Duh!我告诉过您这一定很简单。谢谢!
function showDiv() {

    var myNumValue = document.getElementById('c').value,
        myNum = parseInt(myNumValue),
        priceFound = false;
    var priceBank = {
        'Price Level 1!': 0,
        'Price Level 2!': 100,
        'Price Level 3!': 200,
        'Price Level 4!': 300,
        'Price Level 5!': 400,
        'Price Level 6!': 500,
        'Price Level 7!': 600
    }

    for (var price in priceBank) {
        if ( myNum <= priceBank[price]) {
            document.getElementById('priceInfo').innerHTML = price;
            priceFound = true;
            break;
        }
    }
    if( !priceFound ) {
        document.getElementById('priceInfo').innerHTML = 'no price level found for this amount.';
    }
}