Javascript onchange未捕获下拉框更改

Javascript onchange未捕获下拉框更改,javascript,onchange,Javascript,Onchange,好的,我正在尝试使用onchange从dropbx中捕获值,但是当我在框中选择值时,它似乎从未捕获onchange,并且我为我尝试捕获更改的变量获取了一个未定义的值。我将print语句弹出到onchange函数调用中,它似乎永远不会选择值开关。非常感谢您的帮助 newWindow = window.open("", null, "height=400,width=800,status=yes,toolbar=no,menubar=no,location=no"); newWindow.docu

好的,我正在尝试使用onchange从dropbx中捕获值,但是当我在框中选择值时,它似乎从未捕获onchange,并且我为我尝试捕获更改的变量获取了一个未定义的值。我将print语句弹出到onchange函数调用中,它似乎永远不会选择值开关。非常感谢您的帮助

newWindow = window.open("", null, "height=400,width=800,status=yes,toolbar=no,menubar=no,location=no");

newWindow.document.title = "Crafting Window";
newWindow.document.body.style.background = "#00214D";
newWindow.document.body.style.color = "White";

// create a form and set properties
var form = document.createElement('form');
form.method = 'post';

// insert into the body of the new window
newWindow.document.body.appendChild(form);

// add text before the input
var cNumLab = document.createElement('cNumLab');
form.appendChild(document.createTextNode('Craft Number:'));

// add a text input
var cNum = document.createElement('input');
cNum.type = 'text';
cNum.name = 'input';
cNum.value = '';
form.appendChild(cNum);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var sDescL = document.createElement('sDescL');
form.appendChild(document.createTextNode('Short Desc:'));

// add a text input
var sDesc = document.createElement('input');
sDesc.type = 'text';
sDesc.name = 'sDesc';
sDesc.value = '';
sDesc.size = 50;
form.appendChild(sDesc);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var lDescL = document.createElement('lDesc');
form.appendChild(document.createTextNode('Long Desc:'));

// add a text input
var lDesc = document.createElement('input');
lDesc.type = 'text';
lDesc.name = 'lDesc';
lDesc.value = '';
lDesc.size = 80;
form.appendChild(lDesc);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eDescL = document.createElement('eDescL');
form.appendChild(document.createTextNode('Extended Desc:'));

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add a text input
var eDesc = document.createElement('textarea');
eDesc.type = 'text';
eDesc.name = 'eDesc';
eDesc.value = '';
form.appendChild(eDesc);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eTools = document.createElement('eTools');
form.appendChild(document.createTextNode('Tools:'));

// add a text input
var eTool = document.createElement('input');
eTool.type = 'text';
eTool.name = 'eTools';
eTool.value = '';
form.appendChild(eTool);


var tools = document.createElement('select');
tools.id = 'sTools';
tools.name = 'sTools';
form.appendChild(tools);

var cTool;
var e = document.getElementById("sTools");
var options = [
    ["Forge 33", "33"],
    ["Workbench 1391", "1391"],
    ["Oven 1753", "1753"],
    ["Mortar-Pestle 3277", "3277"],
    ["Chisel 3349", "3349"],
    ["Pottery Wheel 3420", "3420"],
    ["Kiln 3421", "3421"],
    ["Blowpipe3422", "3422"],
    ["Bookbinder 3467", "3467"],
    ["Palette 3483", "3483"]
];

for (var i = 0; i < options.length; i++) {
    var opt = document.createElement('option');
    opt.appendChild(document.createTextNode(options[i][0]));
    opt.value = options[i][1];
    tools.appendChild(opt);
}

tools.onchange = function () {
    print("GOT HERE");
    cTool = e.options[e.selectedIndex].value;
    alert(cTool);
};

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eIngreds = document.createElement('eIngreds');
form.appendChild(document.createTextNode('Ingredients:'));

// add a text input
var eIngred = document.createElement('input');
eIngred.type = 'text';
eIngred.name = 'eIngred';
eIngred.value = '';
eIngred.size = 50;
form.appendChild(eIngred);


//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps1 = document.createElement('eSteps1');
form.appendChild(document.createTextNode('Step 1:'));

// add a text input
var eStep1 = document.createElement('input');
eStep1.type = 'text';
eStep1.name = 'eStep1';
eStep1.value = '';
eStep1.size = 80;
form.appendChild(eStep1);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps1 = document.createElement('eSteps2');
form.appendChild(document.createTextNode('Step 2:'));

// add a text input
var eStep2 = document.createElement('input');
eStep2.type = 'text';
eStep2.name = 'eStep2';
eStep2.value = '';
eStep2.size = 80;
form.appendChild(eStep2);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps3 = document.createElement('eSteps3');
form.appendChild(document.createTextNode('Step 3:'));

// add a text input
var eStep3 = document.createElement('input');
eStep3.type = 'text';
eStep3.name = 'eStep3';
eStep3.value = '';
eStep3.size = 80;
form.appendChild(eStep3);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps4 = document.createElement('eSteps4');
form.appendChild(document.createTextNode('Step 4:'));

// add a text input
var eStep4 = document.createElement('input');
eStep4.type = 'text';
eStep4.name = 'eStep4';
eStep4.value = '';
eStep4.size = 80;
form.appendChild(eStep4);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps5 = document.createElement('eSteps5');
form.appendChild(document.createTextNode('Step 5:'));

// add a text input
var eStep5 = document.createElement('input');
eStep5.type = 'text';
eStep5.name = 'eStep5';
eStep5.value = '';
eStep5.size = 80;
form.appendChild(eStep5);

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

// add text before the input
var eSteps6 = document.createElement('eSteps6');
form.appendChild(document.createTextNode('Step 6:'));

// add a text input
var eStep6 = document.createElement('input');
eStep6.type = 'text';
eStep6.name = 'eStep6';
eStep6.value = '';
eStep6.size = 80;
form.appendChild(eStep6);

var cTool;
var e = document.getElementById("sTools");

tools.onchange = function () {
    cTool = e.options[e.selectedIndex].value;
    alert(cTool);

};

//add linebreak
var linebreak = document.createElement('br');
form.appendChild(linebreak);

var eSubmit = document.createElement('button');
eSubmit.type = 'button';
//eSubmit.name = 'Submit Design';
eSubmit.innerHTML = 'Submit Design';
eSubmit.onclick = function () {

    if (sDesc.value !== "") {
        client.send_direct("craft edit " + cNum.value + " short_desc " + sDesc.value);
    }
    if (lDesc.value !== "") {
        client.send_direct("craft edit " + cNum.value + " long_desc " + lDesc.value);
    }
    if (eDesc.value !== "") {
        client.send_direct("craft edit " + cNum.value + " extended_desc " + eDesc.value);
    }
    if (eIngred.value !== "") {
        client.send_direct("craft ingredients " + cNum.value + "  " + eIngred.value);
    }
    if (eTool.value !== "") {
        client.send_direct("craft tools " + cNum.value + " add " + eTool.value);
    }
    if (eStep1.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 1 1 " + eStep1.value);
    }
    if (eStep2.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 2 1 " + eStep2.value);
    }
    if (eStep3.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 3 1 " + eStep3.value);
    }
    if (eStep4.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 4 1 " + eStep4.value);
    }
    if (eStep5.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 5 1 " + eStep5.value);
    }
    if (eStep6.value !== "") {
        client.send_direct("craft steps " + cNum.value + " change 6 1 " + eStep6.value);
    }
    alert(cTool);
};
form.appendChild(eSubmit);

把你的代码缩减到有问题的代码/问题。还有…不使用Jquery有什么原因吗??因为如果上次我只发布了子集,那么所有代码可能只有几行,它工作正常,并且被告知发布整个表单。而且我不熟悉JQuery。我只是在重新学习JavaScript。我来看看谢谢@Kylek使用jquery有什么原因吗?我不这么认为。他可以使用jquery,也可以不使用jquery,这与问题无关asked@Juan你说得对,这与这个问题无关,但这个网站是关于帮助他人和传授知识的。我无法想象在任何类型的DOM操作或AJAX中再使用普通的老javascript。此外,Jquery还加入了跨浏览器功能。这是双赢。@user3763307您的具体问题很难找到。不过,我要指出几件事。如果要设置两次onchange属性,则第二次分配将取消第一次分配。您正在重新设计e变量,我不确定您为什么要从e读取选项属性。。。您不应该使用onchange,而应该使用事件侦听器。我建议您首先声明所有变量,了解作用域和更好的代码结构化方法,复制/粘贴不是一个好方法,了解异步调用是什么。。。