如何从模式中的输入中使用document.getElementById？

我有一个自制的模态(不是bootstrap),我已经插入一个表单,我需要使用JS来检索以下值:

        
X

                
Please contact me with any questions or to request a Free Home Market Analysis

                
                    

                        
                    
                    

                        
                    
                    

                        
                    
                    

                        
                    
                    

                    
                    
                    

                        Submit
                    
                    
                
        
    




Hi

测试输入和按钮是在模态外部工作的示例.这是JS:

function submitForm(){
    var xmlhttp = new XMLHttpRequest();

    var fn = document.getElementById('fname').value;
    var ln = document.getElementById('lname').value;
    var e = document.getElementById('email').value;
    var p = document.getElementById('phone').value;
    var m = document.getElementById('message').value;

    alert(fn);

    var test = document.getElementById('test').value;

    alert(test);
}

第一个警报(fn)警告"未定义",而第二个警报(测试)警告我输入测试输入框的值.

这是为什么以及解决方法是什么？我尝试制作一个jsfiddle:https://jsfiddle.net/k1g9dq7w/ 但是小提琴不起作用,也许有人知道更多关于JsFiddle及其原因.

id从中移除

.id在文档中是独一无二的.