JQuery - 条件なしで選択オプションでデータを選択する際のランダムコードジェネレータ

Question

jQueryを使用してランダムコードを生成するコードを記述しています。それは正常に動作していた。しかし、私はそれを達成するために条件を使用した。私が必要とするのは、その機能を書くことです条件なし...どうすればそれを得ることができますか？他

Answer 1

あなたがそれを使用し、オプションの値を変更することができる場合

function getcodes() 
 
    { 
 
     
 
     var input_data = $('.getvalue').val(); 
 
     var select_data = $('.control').val(); 
 
     if(select_data == "Binary") 
 
     { 
 
     select_data = "BY"; 
 
     } 
 
     else if(select_data == "Alpha") 
 
     { 
 
     select_data = "AA"; 
 
     } 
 
     else if(select_data == "AlphaNumeric") 
 
     { 
 
     select_data = "AN"; 
 
     } 
 
     else if(select_data == "Numeric") 
 
     { 
 
     select_data = "NC"; 
 
     } 
 
     else 
 
     { 
 
     select_data =""; 
 
     } 
 

 
     $('.disabled').val(input_data + select_data); 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="selector"> 
 
    <div class="get-values"> 
 

 
     <input type="text" value="" class="getvalue"> 
 
     <select class="control"> 
 
      <option value="">select</option> 
 
      <option value="Binary">Binary</option> 
 
      <option value="Alpha">Alpha</option> 
 
      <option value="AlphaNumeric">AlphaNumeric</option> 
 
      <option value="Numeric">Numeric</option> 
 
     </select> 
 
     <input type="button" value="getcode" class="getcode" onclick="getcodes()"> 
 
     <input type="text" value="" class="disabled" disabled> 
 
    </div> 
 
</div>

、 - 使用データAPI

function getcodes() { 
 
    $('.disabled').val($('.getvalue').val() + $('.control option:selected').data('val')); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="selector"> 
 
    <div class="get-values"> 
 

 
    <input type="text" value="" class="getvalue"> 
 
    <select class="control"> 
 
      <option value="" data-val="">select</option> 
 
      <option value="Binary" data-val="BY">Binary</option> 
 
      <option value="Alpha" data-val="AA">Alpha</option> 
 
      <option value="AlphaNumeric" data-val="AN">AlphaNumeric</option> 
 
      <option value="Numeric" data-val="NC">Numeric</option> 
 
     </select> 
 
    <input type="button" value="getcode" class="getcode" onclick="getcodes()"> 
 
    <input type="text" value="" class="disabled" disabled> 
 
    </div> 
 
</div>

Answer 2

あなたは、オブジェクトを使用することができます。このような。

var codesArray = { 
 
    "Binary": "BY", 
 
    "Alpha": "AA", 
 
    "AlphaNumeric": "AN", 
 
    "Numeric": "NC" 
 
}; 
 

 
function getcodes() { 
 

 
    var input_data = $('.getvalue').val(); 
 
    var select_data = $('.control').val(); 
 

 
    $('.disabled').val(input_data + codesArray[select_data]); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="selector"> 
 
    <div class="get-values"> 
 

 
    <input type="text" value="" class="getvalue"> 
 
    <select class="control"> 
 
      <option value="">select</option> 
 
      <option value="Binary">Binary</option> 
 
      <option value="Alpha">Alpha</option> 
 
      <option value="AlphaNumeric">AlphaNumeric</option> 
 
      <option value="Numeric">Numeric</option> 
 
     </select> 
 
    <input type="button" value="getcode" class="getcode" onclick="getcodes()"> 
 
    <input type="text" value="" class="disabled" disabled> 
 
    </div> 
 
</div>

Answer 3

あなたはそのためのarrayを作成する必要があります条件

function getcodes() { 
 
    var input_data = $('.getvalue').val(); 
 
    var select_data = $('.control').val(); 
 
    select_data = select_data == "Binary" ? "BY" : (select_data == "Alpha") ? "AA" : (select_data == "AlphaNumeric") ? "AN" : (select_data == "Numeric") ? "NC" : ""; 
 
    $('.disabled').val(input_data + select_data); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="selector"> 
 
    <div class="get-values"> 
 

 
    <input type="text" value="" class="getvalue"> 
 
    <select class="control"> 
 
      <option value="">select</option> 
 
      <option value="Binary">Binary</option> 
 
      <option value="Alpha">Alpha</option> 
 
      <option value="AlphaNumeric">AlphaNumeric</option> 
 
      <option value="Numeric">Numeric</option> 
 
     </select> 
 
    <input type="button" value="getcode" class="getcode" onclick="getcodes()"> 
 
    <input type="text" value="" class="disabled" disabled> 
 
    </div> 
 
</div>

Answer 4

場合、単一の行で試してみてください！

function getcodes() 
 
    { 
 
     
 
     var input_data = $('.getvalue').val(); 
 
     var select_data_input = $('.control').val(); 
 
     var array = ["BY","AA","AN","NC"]; 
 
     var select_data = array[select_data_input]; 
 

 
     $('.disabled').val(input_data + select_data); 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="selector"> 
 
    <div class="get-values"> 
 

 
     <input type="text" value="" class="getvalue"> 
 
     <select class="control"> 
 
      <option value="">select</option> 
 
      <option value="0">Binary</option> 
 
      <option value="1">Alpha</option> 
 
      <option value="2">AlphaNumeric</option> 
 
      <option value="3">Numeric</option> 
 
     </select> 
 
     <input type="button" value="getcode" class="getcode" onclick="getcodes()"> 
 
     <input type="text" value="" class="disabled" disabled> 
 
    </div> 
 
</div>

Answer 5

このコードを試してみてください。