HTML/Javascript/PHP国家和州列表

我有一个脚本，它获取用户选择的国家，然后将相应的状态放入状态框中

下面是我头脑中的Javascript代码：

<script type="text/javascript" src="jquery-1.9.1.min.js">
</script>

<script type="text/javascript">
$(document).ready(function () {
$("#theselect").change(function() {
var option = $(this).val();
        $.get("select.php", {select:option},function(data){
            $("#theresult").html(data).hide().fadeIn(1000);
        });
    });
});
</script>

$（文档）.ready（函数（）{
$（“#选择”）.change（函数（）{
var option=$（this.val（）；
$.get（“select.php”，{select:option}，函数（数据）{
$（“#theresult”）.html（data.hide（）.fadeIn（1000）；
});
});
});

以下是正文中的HTML代码：

<select name="theselect" id="theselect">
<option value="">Select</option>
<option value="submit_ind">Submit Individual Need</option>
<option value="submit_org">Submit Organization Need</option>
<option value="missionary">Submit Missionary Need</option>

挑选
提交个人需要
提交组织需求
满足传教士的需要

下面是select.php脚本，它给出了选择每个选项时要显示的信息：

echo "<script type= 'text/javascript' src = 'http://www.1511project.com/countries.js'></script>
";


***The other options are usually here but due to character restraints I had to delete to rest of it.  So I do have an original If statement and 2 other elseif statement***    

elseif($_GET['select'] == 'missionary') {

echo "<script>print_country('country');</script>";

?>
<script>

function limitText(limitField, limitCount, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } else {
        limitCount.value = limitNum - limitField.value.length;
    }
}

function validateForm()
{
var x=document.forms["myForm"]["firstname"].value;
if (x==null || x=="")
  {
  alert("First name must be filled out");
  return false;
  }

var r=document.forms["myForm"]["titleofneed"].value;
if (r==null || r=="")
  {
  alert("Title of need must be filled out");
  return false;
  }

var s=document.forms["myForm"]["country"].value;
if (s==null || s=="")
  {
  alert("Country must be filled out");
  return false;
  }


var u=document.forms["myForm"]["phone"].value;

var b=document.forms["myForm"]["email"].value;
if ((b==null || b=="") && (u==null || u==""))
  {
  alert("Email or Phone must be provided for contact information.");
  return false;
  }

var c=document.forms["myForm"]["city"].value;
if (c==null || c=="")
  {
  alert("City must be filled out");
  return false;
  }

var d=document.forms["myForm"]["state"].value;
if (d==null || d=="")
  {
  alert("State must be filled out");
  return false;
  }

var h=document.forms["myForm"]["recurring"].value;
if (h==null || h=="")
  {
  alert("Recurring need must be filled out");
  return false;
  }

var j=document.forms["myForm"]["typeofneed"].value;
if (j==null || j=="")
  {
  alert("Type of need must be filled out");
  return false;
  }

}
</script>

<p>Please enter the information below for the CONTACT PERSON of the need you are submitting.<br /><br /></p>
<form action="processneedmiss.php" name="myForm" method="post" onsubmit="return validateForm();">
<p>First Name: <input type="text" name="firstname" /></p>
<p>Phone #: <input type="text" name="phone" /> <img src='http://www.aotees.com/images/questionMarkIcon_SMALL.jpg' alt='Must provide phone number OR email.  Providing both is recommended.' title='Must provide phone number OR email.  Providing both is recommended.' height='15' width='15'></p>
<p>Email: <input type="text" name="email" /> <img src='http://www.aotees.com/images/questionMarkIcon_SMALL.jpg' alt='Must provide phone number OR email.  Providing both is recommended.' title='Must provide phone number OR email.  Providing both is recommended.' height='15' width='15'></p>




<p>Country: <select onchange="print_state('state',this.selectedIndex);" id="country" name = "country"></select></p>

<p>District/State: <select name ="state" id = "state"></select></p>





<p>City: <input type="text" name="city" /></p>
<p>Title of Need: <input type="text" name="titleofneed" /> <img src='http://www.aotees.com/images/questionMarkIcon_SMALL.jpg' alt='Type a short title to organize your needs.' title='Type a short title to organize your needs.' height='15' width='15'></p>
<p>Type of Need: <select name="typeofneed"> <option></option><option>Supplies</option><option>Lawn Care</option> <option>Heavy Lifting</option><option>Event Volunteering</option><option>Home Repair</option> <option>Clean Up</option> <option>Other</option></select></p>
<p>Recurring Need:
<select name='recurring' size='1'>
<option value=''></option>
<option>No</option>
<option>Yes</option>
</select> <img src='http://www.aotees.com/images/questionMarkIcon_SMALL.jpg' alt='If need happens on a regular basis, select Yes' title='If need happens on a regular basis, select Yes.' height='15' width='15'>
</p>
<p>
How many people are needed: <input type="number" name="howmanypeople" /> <img src='http://www.aotees.com/images/questionMarkIcon_SMALL.jpg' alt='If you want the need to be taken down after a certain number of people sign up for the need, enter that number here. If you only want 1 person leave this blank.' title='If you want the need to be taken down after a certain number of people sign up for the need, enter that number here. If you only want 1 person leave this blank.' height='15' width='15'> 
</p>
<p>Expiration Date: (If no expiration date leave blank.)
<br>
Month: 
        <select name='month' size='1'>
    <option value='0'></option>
    <option value='1'>1</option>
    <option value='2'>2</option>
    <option value='3'>3</option>
    <option value='4'>4</option>
    <option value='5'>5</option>
    <option value='6'>6</option>
    <option value='7'>7</option>
    <option value='8'>8</option>
    <option value='9'>9</option>
    <option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>
  Day:
<select name='day' size='1'>
    <option value='0'></option>
    <option value='1'>1</option>
    <option value='2'>2</option>
    <option value='3'>3</option>
    <option value='4'>4</option>
    <option value='5'>5</option>
    <option value='6'>6</option>
    <option value='7'>7</option>
    <option value='8'>8</option>
    <option value='9'>9</option>
    <option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>
  Year:
<select name='year' size='1'>
    <option value='0'></option>
    <option value='2012'>2012</option>
    <option value='2013'>2013</option>
    <option value='2014'>2014</option>
    <option value='2015'>2015</option>
    <option value='2016'>2016</option>
    <option value='2017'>2017</option>
    <option value='2018'>2018</option>
    <option value='2019'>2019</option>
    <option value='2020'>2020</option>
    <option value='2021'>2021</option>
    <option value='2022'>2022</option>
    <option value='2023'>2023</option>
    <option value='2024'>2024</option>
    <option value='2025'>2025</option>
    <option value='2026'>2026</option>
    <option value='2027'>2027</option>
    <option value='2028'>2028</option>
</select>
</p>
<p>Description of Need: <br>(Do not include sensitive information you don't want others seeing on the website.)<br /><textarea name="description" onKeyDown="limitText(this.form.description,this.form.countdown,850);" 
onKeyUp="limitText(this.form.description,this.form.countdown,850);" style="margin: 2px; width: 494px; height: 164px;"></textarea><br><font size="1">(Maximum characters: 850)<br>
You have <input readonly type="text" name="countdown" size="4" value="850"> characters left.</font></p>
<p><input type="submit" value="Submit" /></p>
</form>
<?php
}
?>

echo”
";
***其他选项通常在这里，但由于性格限制，我不得不删除它的其余部分。所以我有一个原始的If语句和另外两个elseif语句***
elseif（$_GET['select']=='宣教士'）{
呼应“打印国家（‘国家’）；”；
?>
函数limitText（limitField、limitCount、limitNum）{
如果（limitField.value.length>limitNum）{
limitField.value=limitField.value.substring（0，limitNum）；
}否则{
limitCount.value=limitNum-limitField.value.length；
}
}
函数validateForm（）
{
var x=document.forms[“myForm”][“firstname”].value；
如果（x==null | | x==“”）
{
警告（“必须填写姓名”）；
返回false；
}
var r=document.forms[“myForm”][“titleofneed”].value；
如果（r==null | | r==“”）
{
警告（“必须填写需求标题”）；
返回false；
}
var s=document.forms[“myForm”][“country”]。值；
如果（s==null | | s==“”）
{
警报（“必须填写国家”）；
返回false；
}
var u=document.forms[“myForm”][“phone”].value；
var b=document.forms[“myForm”][“email”].value；
如果（（b==null | | b==“”）和&（u==null | | u==“”）
{
提醒（“必须提供联系信息的电子邮件或电话”）；
返回false；
}
var c=document.forms[“myForm”][“city”].value；
如果（c==null | | c==“”）
{
警报（“必须填写城市”）；
返回false；
}
var d=document.forms[“myForm”][“state”].value；
如果（d==null | | d==“”）
{
警报（“必须填写状态”）；
返回false；
}
var h=document.forms[“myForm”][“Recurtive”].value；
如果（h==null | | h==“”）
{
警报（“必须填写重复性需求”）；
返回false；
}
var j=document.forms[“myForm”][“typeofneed”].value；
如果（j==null | | j==“”）
{
警报（“必须填写需求类型”）；
返回false；
}
}
请为您提交的需求联系人输入以下信息。


名字：

电话：

电邮：

国家：

地区/州：

城市：

需要名称：

需求类型：供应、保养、重型吊装活动、志愿服务、房屋维修、清理、其他

经常性需要：
不
对


需要多少人：

到期日期：（如果没有到期日期，则留空。）


月份：
1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12
日期：
1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12
13
14
15
16
十七,
18
19
20
21
22
23
24
25
26
27
28
29
30
31
年份：
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
2026
2027
2028

需求描述：
（不要包含您不希望他人在网站上看到的敏感信息。）

（最多850个字符）

你还有角色

我遇到的问题是，当人们第一次选择“传教士”选项时，它不会显示传教士的形式。但是如果我先选择另一种形式，然后选择传教士的形式，它会显示出来并很好地工作。或者如果我先选择另一种形式，然后选择传教士的形式，它会工作。但如果我选择“传教士”，它不会工作首先

我以“传教士”的形式找到了这段代码的问题根源：

print_country（“国家”）；

如果该代码在表单中的任何位置，表单将不会第一次出现

---

有人能帮忙吗？

当您返回非“传教士”案例时，您似乎只在页面上包含了

countries.js

库。请确保将该文件包含在您的

elseif

中：

elseif($_GET['select'] == 'missionary') {

    echo "<script type= 'text/javascript' src = 'http://www.1511project.com/countries.js'></script>";
    echo "<script>print_country('country');</script>";

}

elseif（$\u GET['select']=='传教士'）{
回声“；
呼应“打印国家（‘国家’）；”；
}

---

编辑：为什么你甚至在你的AJAX返回中包含js文件，而不是总是在你的父页面中。这样，它就可以随时使用。它不会给原始页面加载带来太多开销，但它会在AJAX返回中引起问题。

如果我不是noob，我会的。谢谢！

elseif($_GET['select'] == 'missionary') {

    echo "<script type= 'text/javascript' src = 'http://www.1511project.com/countries.js'></script>";
    echo "<script>print_country('country');</script>";

}