تغيير نوع الإدخال

Question

وأنا أعمل على موقع ديناميكي إلى حد ما، وأريد المستخدم لتكون قادرة على اختيار ما يريدون الإدخال. الخيارات المدخلات هي أنواع مختلفة من المدخلات (النص، كلمة المرور، وما إلى ذلك) هل هناك أسلوب / وسيلة لخلق هذا؟ كنت أفكر أن اختاروا من القائمة المنسدلة ثم جافا سكريبت يعتني بقية. ولكن أود أن أعتقد أنه يجب أن يكون هناك طريقة أنشئت للتعامل مع هذا أنني مجرد عدم العثور على شبكة الإنترنت.

وشكرا على اي مساعدة.

Answer 1

في جافا سكريبت، سوف تقوم بإنشاء الإدخال كما يلي.

var input = document.createElement('input');
input.type = 'button';
...

ولذا، إذا كنت ترغب في إنشاء المدخلات على الطاير، يمكنك إنشاء المنسدلة تسرد أنواع المدخلات كسلاسل (زر، والنص، وما إلى ذلك). ثم، وبمجرد أن المستخدم قد اختار السلسلة في القائمة المنسدلة، هل نقله إلى وظيفة جافا سكريبت كما يلي:

function createInput(type) {
  var input = document.createElement('input');
  input.type = type
  ...
  return input;
}

وبعد ذلك، إذا أردت إلحاق الإدخال إلى عنصر على الصفحة مع معرف 'فو':

var input = createInput('button');
var appendToThis = document.getElementById('foo');
appendToThis.appendChild(input);

إذا كنت ترغب في أن تبدأ مع شعبة على الصفحة، تخيل لديك علامة div مع فو معرف على الصفحة:

<div id=foo><input type=text></div>

وبعد ذلك، عندما يختار المستخدم عنصر، مسح شعبة وتقديم مدخلات جديدة:

function whenUserChoosesAType(type) {
  var div = document.getElementById('foo');
  rac(div);
  var input = document.createElement('input');
  div.appendChild(input);
}      

//abbreviated function to clear the contents of a DOM element such as a div
function rac(elem) {
  while(elem.hasChildNodes()) elem.removeChild(elem.firstChild);
}

Answer 2

وأنا أصلا الإجابة على الأسئلة الخاصة بك مثل هذا:

<input type="text" id="changingInput">
<input type="button" value="Click Here For Example Of Changing" onclick="javascript:document.getElementById('changingInput').type = 'password';">

ولكن بعد ذلك راجعت وأنها لا تعمل في IE ... أو دورة (يعمل بشكل رائع في سفاري) وهكذا وجدت هذا الرابط الكبير هنا:.

HTTP: // شبكة الاتصالات العالمية .universalwebservices.net / برمجة الموارد على شبكة الإنترنت / جافا سكريبت / تغيير المدخلات عنصر من نوع باستخدام جافا سكريبت

وآمل أن يساعد هذا!