Question

我目前正在营销页面。它有一个表单，要求用户输入他们的名称及其邮政编码和电子邮件地址。一旦用户这样做，它将要求他们选择靠近他们的位置以获得优惠券。表单当前仅在用户填写其邮政编码时显示位置。否则它会显示一个框，告诉他们输入他们的邮政编码。我正在努力让用户也被要求输入电子邮件地址。我试图设置我的代码只有在两者都填满时才显示位置。以下是我无法开展的工作。

<form id="sportsclips">
                    <div id="return-data"></div>
                    <input type="text" id="fullname" name="fullname" tabindex="1000" maxlength="35" placeholder="Full Name" />
                    <input type="text" id="email" name="email" tabindex="2000" maxlength="45" placeholder="Email Address *" />
                    <input type="text" id="zipcode" name="zipcode" tabindex="4000" maxlength="5" placeholder="Zip Code *" />                        

                    <a href="javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block';zipit(document.getElementById('zipcode').value);" class="coupon" >GET MY COUPON</a>

                    <div id="light" class="white_content">
                    <h1>SELECT A PARTICIPATING LOCATION TO RECEIVE YOUR COUPON</h1>
                    <div class="col-sm-12" style="height: 35px !important;"></div>

                   <div class="col-sm-12" style="margin-bottom: 20px !important;"><a href="javascript:void(0)" class="cls" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none';">X</a></div>

                   <div id="data"></div>



                    </div>

                    </form>

产生结果的php如下：

<?php

if(isset($_POST['zipcode']) && $_POST['zipcode'] != "" && $_POST['email'] != "" )
{
    # vars
    $country     = 'US';
    $apiKey      = 'AIzaSyA39tPZzpT6KxjVEvmSFV_yWdR7kQvL0zU';
    $latitude    = '';
    $longitude   = '';
    $link        = '';
    $sql         = '';
    $result      = '';
    $earthRadius = '';

    # connect to the google geocode service
    $file = "https://maps.googleapis.com/maps/api/geocode/xml?address=".$_POST['zipcode'].",".$country."&amp;output=csv&amp;key=".$apiKey."";

    # load xml
    $xml = simplexml_load_file($file) or die("url not loading");

    # check if status is good
    $status = $xml->status;

    if ($status == "OK") 
    {
            # grab latitude and longitude from zip to match against db
            $latitude = $xml->result->geometry->location->lat;
            $longitude = $xml->result->geometry->location->lng; 

            # Build the spherical geometry SQL string
            $earthRadius = '3963.0'; // In miles

            # db connect if post is true
            $link = mysql_connect('localhost','haircutp_spor7Cl','~=L6QK%%lck-{dZ,Of');

            if(!($link))
            {
                echo "Error Connecting to the Database".mysql_error();
            }
            else 
            {
                mysql_select_db('haircutp_ca_promo');           
            }

            # db call to locations by lat / long
            $sql = "
                SELECT ROUND(
                        ".$earthRadius." * ACOS(  
                            SIN( ".$latitude."*PI()/180 ) * SIN( latitude*PI()/180 )
                            + COS( ".$latitude."*PI()/180 ) * COS( latitude*PI()/180 )  *  COS( (longitude*PI()/180) - (".$longitude."*PI()/180) )   ) 
                    , 1)
                    AS distance, store_name, postal_address, latitude, longitude, phone, store_id 
                FROM stores
                ORDER BY distance ASC LIMIT 3";

            # Search the database for the nearest agents
            $result = mysql_query($sql);

            # run loop on locations
            while ($row = mysql_fetch_array($result))
            {
                echo '<div class="col-sm-4 loc">';
                echo '<strong>'.$row['store_name'].'</strong><br />';
                echo ''.$row['postal_address'].'<br />';
                echo '<a href="tel:1-'.$row['phone'].'" class="ph">'.$row['phone'].'</a><br />';
                echo '<br />~ '.$row['distance'].' miles ~<br /><br />';
                echo '<input type="button" id="sendcoupon_'.$row['store_id'].'" name="sendcoupon_'.$row['store_id'].'" onclick="spc(\''.$row['store_id'].'\')" tabindex="6000" value="GET COUPON" />';
                echo '</div>';
            }

            mysql_close($link);
    }
}
else
{
    # if not zip code
    echo '<div class="col-sm-6 loc">';
    echo '<strong>You Must Input Your Zip Code and Email Address. Please Try Again!</strong><br />';
    echo '</div>';  
}


?>

Answer 1

您可以使用输入＆＃34;必需＆＃34;属性，但它取决于浏览器，所以更好的方法可以在Javascript中自己检查。

＆＃34;必需＆＃34;的例子属性：

<input type="text" name="myfield" required />

https://www.w3schools.com/tags/att_input_required.asp

禁用表单上的提交按钮，直到字段完成

1 个答案: