3

ユーザーが選択した国に応じて、「電話」の定型入力を変更したい。私の問題は、要素 ID を正しい構文で変更するための jQuery コードがないことにあると確信しています。

まず、連絡先が既にファイルに登録されているかどうかを確認し、見つかった場合はデータを表示します。国際電話番号の連絡先を見つけると、希望どおりに番号が表示されます。私たちの連絡先のほとんどは米国からのものなので、そのコードを最初の表示として選択します. この問題は、新しい連絡先が米国 (または国際コード「1」) 以外の国から登録された場合に発生します。その後、マスキングはiphoneに変わりません。

 <html>
 <head>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js">
 </script>
 <script src="jquery.js" type="text/javascript"></script>
 <script type="text/javascript" src= "../js/jquery.maskedinput.js"></script>
 <script>
 function show() 
 {
 var a = document.getElementById('country');
 var a = a.value.split(",")[1];
 document.getElementById("code").value= a+"+";
 if(a!=1)
jQuery(this).prev("phone").attr("id", "iphone");
 else
jQuery(this).prev("iphone").attr("id", "phone");    
 };
 </script>
 </head>
 <body>

 <p>Country:&nbsp;
<select id="country" name="country" onchange="show(this)">       
    <option value="United States,1" selected>United States</option><?php $code=1 ?>
    <option value="Sweden,37">Sweden</option>
 </p>

 <p>Phone:&nbsp;
 <?php echo '<input name="code"  id="code" size="1" type ="text" disabled="disabled" value="'.$code.'+"/>';
 if($code!=1)
 {
echo '<input name="phone"  id="iphone" type="text" value="'.$result1[phone].'"/>';
 }  
 else
 {
echo '<input name="phone" id="phone" type="text" value="'.$result1[phone].'"/>';
 }  
 ?>
 </p>
 <script>jQuery(function($)
 {
   $("#phone").mask("(999) 999-9999");
   $("#iphone").mask("99 99 99 99? 99");  
 }); 
 </script>

 </body>
 </html>
4

3 に答える 3

1

あなたも私が経験した問題を抱えていると思います。その結果、入力された電話番号にさらに一致する入力のマスクを選択するプラグインを開発しました。デモをご覧ください。

于 2013-04-22T11:44:00.617 に答える
0

国を選択するときにクラスを変更してから、新しいクラスでマスクを再初期化できると思います。

<select id="country" name="country" onchange="show(this)">       
    <option value=".unitedStates" selected>United States</option><?php $code=1 ?>
    <option value=".sweden">Sweden</option>

<input type="text" id="phoneNumber" />

JS:

$('#country').change(function(){
  $("select option:selected").each(function () {
    var className = $(this).val();
    $('#phoneNumber').removeClass();
    $('#phoneNumber').addClass(className);
    initMasks();
  });
});

function initMasks(){
  $('.unitedStates').mask("(999) 999-9999");
  $('.sweden').mask("99 99 99 99? 99");  
}
于 2013-02-22T19:55:14.757 に答える
0

user1477388 のおかげで、自分が何をしていたのかを調べました。要素の ID を変更しようとするのではなく、マスクを変更したかっただけです。選択オプションは、国とコード (ダイヤル コード) を含む mySQL データ テーブルから取り込まれます。

 <select id="country" name="country" onchange="show(this)">
 <?php     
 $sql1="SELECT* FROM countries ORDER BY countryName";
 $query1= mysql_query ($sql1) or die("Couldn't execute check country query. ". mysql_error()); 
 while($row1=mysql_fetch_array($query1))
 {
  /* Option values are added by looping through the array */
 echo '<option value="'.$row1[countryName].','.$row1[code].'"\">'.$row1[countryName].'</option>';
 }
 echo "</select>";
 ?>

次に、スクリプト内でダイヤル コード ($code) を読み取って決定します - [var a = a.value.split(",")[1]; ] ダイヤル コード = 1 の場合、形式 #phone は (999) 999-9999 です。そうでない場合、形式 #phone は 99 99 99 99 99 です。

   <script>
   function show() 
   {
    var a = document.getElementById('country');
    var a = a.value.split(",")[1];
   document.getElementById("code").value= a+"+";
   $code=a;
   if(a!=1)
   { 
   $("#phone").mask("99 99 99 99? 99");}
   else
   {$("#phone").mask("(999) 999-9999");
   }
   };
   </script>
于 2013-02-23T15:54:21.893 に答える