在表单中获取选项值,然后在 url 中使用它


Get option value in form, then use it in a url

我有一个表格,你可以选择一个国家,国家包含一个值。
例如,使用该值34<br>如果您将其放在类似 'http://packarmy.nl/img/nation/' . $_GET['nationvalue'] . '.png' 的 url 中,我可以得到一个图像

<img src='http://futhead.cursecdn.com/static/img/16/clubs/<? echo $_GET[nation_id] ?>' >
<select id="nation-id">
   <option value="149">Afghanistan</option>
   <option value="1">Albania</option>
   <option value="97">Algeria</option>
   <option value="194">American Samoa</option>
   <option value="2">Andorra</option>
   <option value="98">Angola</option>
   <option value="62">Anguilla</option>
   <option value="63">Antigua &amp; Barbuda</option>
   <option value="52" selected="yes">Argentina</option>
   <option value="3">Armenia</option>
   <option value="64">Aruba</option>
   <option value="195">Australia</option>
   <option value="4">Austria</option>
   <option value="5">Azerbaijan</option>
   <option value="65">Bahamas</option>
   <option value="150">Bahrain</option>
   <option value="151">Bangladesh</option>
   <option value="66">Barbados</option>
   <option value="6">Belarus</option>
   <option value="7">Belgium</option>
   <option value="67">Belize</option>
   <option value="99">Benin</option>
   <option value="68">Bermuda</option>
   <option value="152">Bhutan</option>
   <option value="53">Bolivia</option>
   <option value="8">Bosnia Herzegovina</option>
   <option value="100">Botswana</option>
   <option value="54">Brazil</option>
   <option value="69">British Virgin Isles</option>
   <option value="153">Brunei Darussalam</option>
   <option value="9">Bulgaria</option>
   <option value="101">Burkina Faso</option>
   <option value="102">Burundi</option>
   <option value="154">Cambodia</option>
   <option value="103">Cameroon</option>
   <option value="70">Canada</option>
   <option value="104">Cape Verde Islands</option>
   <option value="71">Cayman Islands</option>
   <option value="105">Central African Rep.</option>
   <option value="106">Chad</option>
   <option value="55">Chile</option>
   <option value="155">China PR</option>
   <option value="56">Colombia</option>
   <option value="214">Comoros</option>
   <option value="107">Congo</option>
   <option value="196">Cook Islands</option>
   <option value="72">Costa Rica</option>
   <option value="10">Croatia</option>
   <option value="73">Cuba</option>
   <option value="11">Cyprus</option>
   <option value="12">Czech Republic</option>
   <option value="13">Denmark</option>
   <option value="109">Djibouti</option>
   <option value="74">Dominica</option>
   <option value="207">Dominican Republic</option>
   <option value="110">DR Congo</option>
   <option value="57">Ecuador</option>
   <option value="111">Egypt</option>
   <option value="76">El Salvador</option>
   <option value="14">England</option>
   <option value="112">Equatorial Guinea</option>
   <option value="113">Eritrea</option>
   <option value="208">Estonia</option>
   <option value="114">Ethiopia</option>
   <option value="16">Faroe Islands</option>
   <option value="197">Fiji</option>
   <option value="17">Finland</option>
   <option value="18">France</option>
   <option value="19">FYR Macedonia</option>
   <option value="115">Gabon</option>
   <option value="116">Gambia</option>
   <option value="20">Georgia</option>
   <option value="21">Germany</option>
   <option value="117">Ghana</option>
   <option value="205">Gibraltar</option>
   <option value="22">Greece</option>
   <option value="206">Greenland</option>
   <option value="77">Grenada</option>
   <option value="157">Guam</option>
   <option value="78">Guatemala</option>
   <option value="118">Guinea</option>
   <option value="119">Guinea Bissau</option>
   <option value="79">Guyana</option>
   <option value="80">Haiti</option>
   <option value="81">Honduras</option>
   <option value="158">Hong Kong</option>
   <option value="23">Hungary</option>
   <option value="24">Iceland</option>
   <option value="159">India</option>
   <option value="160">Indonesia</option>
   <option value="161">Iran</option>
   <option value="162">Iraq</option>
   <option value="26">Israel</option>
   <option value="27">Italy</option>
   <option value="108">Ivory Coast</option>
   <option value="82">Jamaica</option>
   <option value="163">Japan</option>
   <option value="164">Jordan</option>
   <option value="165">Kazakhstan</option>
   <option value="120">Kenya</option>
   <option value="166">Korea DPR</option>
   <option value="167">Korea Republic</option>
   <option value="168">Kuwait</option>
   <option value="169">Kyrgyzstan</option>
   <option value="170">Laos</option>
   <option value="28">Latvia</option>
   <option value="171">Lebanon</option>
   <option value="121">Lesotho</option>
   <option value="122">Liberia</option>
   <option value="123">Libya</option>
   <option value="29">Liechtenstein</option>
   <option value="30">Lithuania</option>
   <option value="31">Luxemburg</option>
   <option value="172">Macao</option>
   <option value="124">Madagascar</option>
   <option value="125">Malawi</option>
   <option value="173">Malaysia</option>
   <option value="174">Maldives</option>
   <option value="126">Mali</option>
   <option value="32">Malta</option>
   <option value="127">Mauritania</option>
   <option value="128">Mauritius</option>
   <option value="83">Mexico</option>
   <option value="33">Moldova</option>
   <option value="175">Mongolia</option>
   <option value="15">Montenegro</option>
   <option value="84">Montserrat</option>
   <option value="129">Morocco</option>
   <option value="130">Mozambique</option>
   <option value="176">Myanmar</option>
   <option value="131">Namibia</option>
   <option value="177">Nepal</option>
   <option value="34">Netherlands</option>
   <option value="85">Netherlands Antilles</option>
   <option value="215">New Caledonia</option>
   <option value="198">New Zealand</option>
   <option value="86">Nicaragua</option>
   <option value="132">Niger</option>
   <option value="133">Nigeria</option>
   <option value="35">Northern Ireland</option>
   <option value="36">Norway</option>
   <option value="178">Oman</option>
   <option value="179">Pakistan</option>
   <option value="180">Palestinian Authority</option>
   <option value="87">Panama</option>
   <option value="199">Papua New Guinea</option>
   <option value="58">Paraguay</option>
   <option value="59">Peru</option>
   <option value="181">Philippines</option>
   <option value="37">Poland</option>
   <option value="38">Portugal</option>
   <option value="88">Puerto Rico</option>
   <option value="182">Qatar</option>
   <option value="25">Republic of Ireland</option>
   <option value="39">Romania</option>
   <option value="40">Russia</option>
   <option value="134">Rwanda</option>
   <option value="200">Samoa</option>
   <option value="41">San Marino</option>
   <option value="135">São Tomé and Príncipe</option>
   <option value="183">Saudi Arabia</option>
   <option value="42">Scotland</option>
   <option value="136">Senegal</option>
   <option value="51">Serbia</option>
   <option value="137">Seychelles</option>
   <option value="138">Sierra Leone</option>
   <option value="184">Singapore</option>
   <option value="43">Slovakia</option>
   <option value="44">Slovenia</option>
   <option value="201">Solomon Islands</option>
   <option value="139">Somalia</option>
   <option value="140">South Africa</option>
   <option value="45">Spain</option>
   <option value="185">Sri Lanka</option>
   <option value="89">St Kitts Nevis</option>
   <option value="90">St Lucia</option>
   <option value="91">St Vincent Grenadine</option>
   <option value="141">Sudan</option>
   <option value="92">Suriname</option>
   <option value="142">Swaziland</option>
   <option value="46">Sweden</option>
   <option value="47">Switzerland</option>
   <option value="186">Syria</option>
   <option value="202">Tahiti</option>
   <option value="213">Taiwan</option>
   <option value="187">Tajikistan</option>
   <option value="143">Tanzania</option>
   <option value="188">Thailand</option>
   <option value="212">Timor-Leste</option>
   <option value="144">Togo</option>
   <option value="203">Tonga</option>
   <option value="93">Trinidad &amp; Tobago</option>
   <option value="145">Tunisia</option>
   <option value="48">Turkey</option>
   <option value="189">Turkmenistan</option>
   <option value="94">Turks &amp; Caicos</option>
   <option value="146">Uganda</option>
   <option value="49">Ukraine</option>
   <option value="190">United Arab Emirates</option>
   <option value="95">United States</option>
   <option value="60">Uruguay</option>
   <option value="96">US Virgin Islands</option>
   <option value="191">Uzbekistan</option>
   <option value="204">Vanuatu</option>
   <option value="61">Venezuela</option>
   <option value="192">Vietnam</option>
   <option value="50">Wales</option>
   <option value="193">Yemen</option>
   <option value="147">Zambia</option>
   <option value="148">Zimbabwe</option>
</select>

但我希望它立即更新,我尝试使用此代码:

$(function() {
    var update = function() {
        $('#photoans').text(        
            $.map($('#photo').serializeArray(),function(a) {
                    return a.value;
                    }).join(", ")
        );
    };
    update();
    $('#photo').change(update);
})

这当然会让你 http://futhead.cursecdn.com/static/img/16/clubs/"<div id=photoans>34</div>".png",所以这不起作用。我希望有人能帮助我。谢谢!

如果我理解正确,我想这就是你想要的:

$("#country").change(function(){
	var curSelection = $(this).val();
  var urlOfImage = "http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/" + curSelection + ".png";
	$("img").attr("src",urlOfImage);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img src="http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/0.png" />
<br>
<select id="country">
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

更新 : 使用输入字段

$("#countryInput").keyup(function(){
	var curInput = $(this).val(); // Current Input URL
	$("#img2").attr("src",curInput);  
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img id="img2" src="http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/0.png" />
<br>
URL : <input type="text" id="countryInput" />
<p>  
  To understand copy and paste this url: <b>http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/1.png</b>
</p>
  

你需要开始 php 和结束 php 标签来回显 $_GET 内容值nation_id

<img src='http://futhead.cursecdn.com/static/img/16/clubs/"<?php echo  $_GET['nation_id'] ?>"' > 

如果您设置 PHP 交互器