كيفية استخدام YUI لتحديد موقع إدخال عبر الاسم وإدراج المحتوى بعد

Question

كيف يمكنني استخدام YUI لتحديد موقع إدخال نص عبر الاسم وإدراج DIV بعد ذلك؟

على سبيل المثال، هذا لا يعمل:

<input name="some_name" type="text">

<script>
var el = new YAHOO.util.Element(document.createElement('div'));
var some_element = document.getElementsByName('some_name');

// doesn't work .... replacing 'some_element' with 'document.body' works
el.appendTo(some_element);

</script>

Answer 1

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

<input name="some_name" id="some_name" type="text">
<script>
(function () {
var el = new YAHOO.util.Element(document.createElement('div'));
// var some_element = document.getElementByName('some_name')[0];
var some_element = document.getElementsById('some_name'); // preferred, faster
// el.appendTo(some_element);
YAHOO.util.Dom.insertAfter(el,some_element);
})();
</script>

لاحظ أيضا استخدام إدراج بدلا من appendto. وبعد لا تريد أن تكون EL ليكون طفلا لعنصر الإدخال الخاص بك. تريد أن تكون الأخوة التالية. المدخلات ليس لديها أطفال. وأخيرا أيضا، فأنت تضيف هذه المتغيرات إلى مساحة الاسم العالمية. قد يكون هذا مشكلة أو قد لا تكون مشكلة، لكن من الجيد عموما لف التعليمات البرمجية الخاصة بك في وظيفة مجهولة ما إذا كنت تنوي المتغيرات أن يكون لها نطاق عالمي وإعادة استخدامها لاحقا، ولكن بعد ذلك قد ترغب في توفير مساحة اسم مناسبة لهم وبعد

نأمل أن يساعد (وليس الكثير من المعلومات)؛)

Answer 2

document.getelementsByname ('some_name') دائما إرجاع مجموعة (صفيف)، إذا كنت متأكدا من أن الاسم فريد من نوعه، فيمكنك كتابة هذا بأمان.

var some_element = document.getElementsByName('some_name')[0];

Answer 3

مع yui 3 يمكنك الآن القيام به هذه:

<script src="http://yui.yahooapis.com/3.18.1/build/yui/yui-min.js"></script>

<input id="some_id" type="text">

<script>
  YUI().use('node', function(Y) {
    var contentNode = Y.Node.create('<p>');
    contentNode.setHTML('This is a para created by YUI...');
    Y.one('#some_id').insert(contentNode, 'after');
  });
</script>

لكنه ضع في اعتبارك يوي يجري توقف!

Answer 4

لقد وضعت أساسا حالة ويقول الاسم = "Some_name".
راجع التعليمات البرمجية أدناه ومراقبة ذلك لا يزال يدخل

argraph.

<script src="http://yui.yahooapis.com/3.18.1/build/yui/yui-min.js"></script>

<input id="some_id" type="text" name="inpuname" >

<script>
  YUI().use('node', function(Y) {
    var contentNode = Y.Node.create('<p>');
    contentNode.setHTML('Paragraph created by YUI by searching for *INPUNAME*...');
    Y.one('input[name="inpuname"]').insert(contentNode, 'after');
  });
</script>