我已阅读过post,但仍有一些疑问。我收到错误消息:
未捕获的TypeError:无法读取null的属性“值”

在这行上:

    fullname = document.getElementById('namefull').value;


我100%确定字段'namefull'在表单上,​​并且我在表单中也输入了一个值。我实际上有一个检查来确保它不为null并通过。这是表格:

<table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF"><b><font face = "Calibri">All Fields Required so we can contact you</b></td>
        </tr>
        <tr>
            <td align="right" colspan="2" bgcolor="#CCFFFF"><b><font face = "Calibri">Name:</b></td>
            <td colspan="3" bgcolor="#CCFFFF"><input type="text"
            size="30" maxlength="30" name="namefull"></td>
        </tr>


完整的代码如下:

    <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>

<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Microsoft FrontPage 2.0">
<title>HABLA Order Form</title>
</head>

<script language="javascript">

// Do not steal, modify, or claim these scripts as your own!  Thank You.
// Alterations and additions by Gordon Smith [email protected]
index = 0;

function getFields() {
    fullname = document.getElementById('namefull').value;
    email = document.getElementById('email').value;
    phone = document.getElementById('phone').value;
    zip = document.getElementById('zip').value;
    amount = document.getElementById('total').value;
    type = document.getElementById('order_type').value;
    seller = 'TestSeller';
    specinstruct = document.getElementById('specinstr').value;
    xact_num = 'StripeDummy';
};

function writeXact() {
    var sendtext;
    getFields();
    if (fullname == "") {
        document.getElementById("txtHint").innerHTML = "";
        return;
    } else {
        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
            }
        }
        sendtext = fullname + "||" + email + "||" + phone + "||" + zip +
                    "||" + amount + "||" + type + "||" + seller + "||" + specinstruct +
                    "||" + xact_num;
        xmlhttp.open("GET","writeXact.php?q="+sendtext,true);
        xmlhttp.send();
    }
};

function format(val, post)
{
    var decpoint;
    var begin;
    var end;
    var valstr;
    var temp_char;

    valstr = "" + val;
    //alert('valstr = ' + valstr);
    decpoint = valstr.indexOf(".")
    if (decpoint != -1) {
        //alert('decpoint = ' + decpoint);
        begin = valstr.substring(0,decpoint);
        end = valstr.substring(decpoint+1,valstr.length);
        //alert('begin = ' + begin + '\nend= ' + end);
    }
    else {
        begin = valstr;
        end = "";
    }
    if (end.length < post)
     {while (end.length < post)
        {
        end += "0";
        }
     }

    end = end.substring(0,post);
    //alert('begin = ' + begin + '\nend= ' + end);
    return (begin+"."+end);
};

function orderSubmit(type)
{
    if (type == 'order')
        {if (  !  ( (document.order.order_type.checked) ||
                checkRequired() ))

            {document.order.form_action.value = type;
            getFields();
            writeXact(fullname, email, phone, zip, amount, type, seller, specinstruct, xact_num);
            document.order.submit();
            return true;
            }
        else {
            // alert('first false');
            return false;
        }
    }
};

var infowin = null;

function checkRequired() {
    if (!document.order.namefull.value.length ||
            !document.order.email.value.length ||
            !document.order.zip.value.length ||
            !document.order.phone.value.length) {
        alert('You have not completed all required fields:\n' +
              'Please enter Name, Email, Phone, Zip');
        return true;
    }
    else {
        return false;
    }
};

<!-- -->
</script><!-- --><a name="top"></a>

<body background="images/thisback.gif" bgcolor="#FFFFFF"
text="#000000" onLoad=parent.refresh_order_details(parent.order_details) onUnload=parent.add_order_details(parent.order_details)>
<center>
<script
language="javascript">
<!-- hide

if (self==parent){document.write('<font color=#ff000><b>This is a frame element, click <a href=shopcartindex.html> here </a>for correct page</b></font>')};
<!-- end hide -->
</script>

<p><size="6" color="black" font face="Calibri"><b>HABLA Event Order Form</b><br>
</font></p>

<!-- YOU CAN PUT YOUR EMAIL ADDRESS IN THE FORM COMMAND BELOW AND THE -->
<!-- THEN IT WILL BE SENT TO YOU AS A SIMPLE MAILTO GUESTBOOK FORM -->
<!-- IF YOU DO THAT - BE SURE TO ADD THE COMMAND enctype="plain/text" -->
<!-- IN ORDER TO DELINEATE THE MAIL FOR YOU -->
<!-- YOU CAN ALSO USE TE .PL FILE AS A CGI TO HELP WTH THE MAIL.  SEE THE TUTORIAL  -->
<!-- FOR MORE ON HOW THAT IS DONE -->
<form action="MAILTO:[email protected]" method="POST" name="order">
    <input type="hidden" name="subject"
    value="Order Forms - HABLA Balie 2015"><input type="hidden"
    name="recipient" value="YOUR EMAIL ADDRESS HERE"><input
    type="hidden" name="redirect"
    value="thanku.htm"><input
    type="hidden" name="retailer" value="NAME OF YOUR BUSINESS HERE"><input
    type="hidden" name="form_action" value="order">
<script
    language="javascript">
<!-- hide from Browsers
document.write('<table width=400><td align=center>');
document.write('<table width=400 ><tr><tr><td align=right colspan=3 ><font face="Calibri"><b>Total Purchase $</b></td><td colspan=3> <input type=text name=total font face="Calibri" value='+ format(parent.all_order_totals(),2) + '></font></td><tr>');
if (parent.items_ordered == 0)
    document.write('<font color=#000080><b>There are no items in your cart<b></font>');
if (parent.item_num > 0);
{

for (i =1;i < parent.item_num;i++)
   { if (parent.itemlist[i].quan > 0)
     {index = index + 1;
document.write('<input size=10 type=text font face="Calibri" name= ' + parent.itemlist[i].code + '   value= ' +  parent.itemlist[i].code + '><input size=6  type=text name= ' + parent.itemlist[i].code + ' value=' +  parent.itemlist[i].price + '><input size=20 type=text  name= ' + parent.itemlist[i].code + '  value= '+  parent.itemlist[i].desc + '><input size=2 type=text name= ' + parent.itemlist[i].desc + '  value= '+  parent.itemlist[i].quan + '><br>');
     }
   }
};

<!-- end hiding -->
</script>

<!-- Customer Info Table -->
<table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF"><b><font face = "Calibri">All Fields Required so we can contact you</b></td>
        </tr>
        <tr>
            <td align="right" colspan="2" bgcolor="#CCFFFF"><b><font face = "Calibri">Name:</b></td>
            <td colspan="3" bgcolor="#CCFFFF"><input type="text"
            size="30" maxlength="30" name="namefull"></td>
        </tr>
        <tr>
            <td align="right" colspan="2" bgcolor="#CCFFFF"><b><font face = "Calibri">Email Address:</b></td>
            <td colspan="3" bgcolor="#CCFFFF"><input type="text"
            size="30" maxlength="60" name="email"></td>
        </tr>
        <tr>
            <td align="right" colspan="2" bgcolor="#CCFFFF"><b><font face = "Calibri">Zip:</b></td>
            <td bgcolor="#CCFFFF"><input type="text" size="9"
            maxlength="10" name="zip"></td>
        </tr>
        <tr>
            <td align="right" colspan="2" bgcolor="#CCFFFF"><b><font face = "Calibri">Phone:</b></td>
            <td colspan="3" bgcolor="#CCFFFF"><input type="text"
            size="25" maxlength="15" name="phone"></td>
        </tr>
    </table>
    <p align="center">
    <table border="0" width=400>
        <tr>
            <td align="center" colspan="6"<b><font face = "Calibri"><b>Special Instructions</b><br></td>
        </tr>
        <tr>
            <td colspan="6"><center><textarea name="specinstr" rows="3"
            cols="40"></textarea></center></td>
        </tr>
    </table>

<!-- Order Method Table -->    </p>
    <table border="0" cellspacing="0" width=400>
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF"><font
            size="4"><b>Choose Order Method:</b></font></td>
        </tr>
                <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF">&nbsp;&nbsp;
            <font size="2">Credit Card: <input type="radio"
            name="order_type" value="phone"></font>&nbsp;&nbsp; </td>
        </tr>
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF">&nbsp;&nbsp;
            <font size="2">Cash: <input type="radio"
            name="order_type" value="phone"></font>&nbsp;&nbsp; </td>
        </tr>
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF">&nbsp;&nbsp;
            <font size="2">Check: <input type="radio"
            name="order_type" value="phone"></font>&nbsp;&nbsp; </td>
        </tr>
        <tr>
            <td align="center" colspan="5" bgcolor="#CCFFFF"><a
            href="options.htm" target=navigate>

            </td>
        </tr>
    </table>
    <p><br>
    <p><br>

<! Stripe Credit Card Integration >
<form action="" method="POST">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_zzzzzz"
    data-amount="2000"
    data-name="Demo Site"
    data-description="2 widgets ($20.00)"
    data-image="/128x128.png"
    data-locale="auto">
  </script>
</form>
<input
    type="button" value="Place Order"
    onclick="orderSubmit('order')"
    <input type="reset" value="Reset Cart"> </p>
    <b>HABLA Friends of River Glen <a href=mailto:[email protected]>[email protected]</a>  </b>

</form>
</td></table>
</center>
</p>
</body >
</html>


是的,我知道代码很乱,但是我正在为学校/慈善筹款活动做这件事,因此非常感谢您的帮助。

最佳答案

您正在寻找id =“ namefull”的元素,但是在html中,您仅指定了name属性:<input type="text" size="30" maxlength="30" name="namefull">
尝试在此处包含id="namefull"

<input type="text" id="namefull" name="namefull" size="30" maxlength="30">


您将希望在每个输入中都遵循以指定id,因为这就是您要使用document.getElementById()查找的内容。

10-07 14:08