أي أفكار حول كيفية إجراء تعديل في المكان للتحلل?

Question

أنا حاليا كتابة تعديل في المكان النصي MooTools و أنا قليلا الحيرة كيف يمكن أن تجعل تتحلل برشاقة دون جافا سكريبت في حين لا تزال تواجه بعض الوظائف.وأود أن استخدام التحسين التدريجي في بعض الطريق.أنا لا أبحث عن رمز ، ولكن أكثر من ذلك المفهوم على كيفية مقاربة الوضع.إذا كان لديك أي أفكار أو أعرف من أي تعديل في المكان النصوص التي تتحلل برشاقة, يرجى حصة.

Answer 1

يبدو أنك قد يقترب من الاتجاه الخاطئ.بدلا من خلق تعديل في المكان والحصول عليه تتحلل بشكل جيد (تدهور رشيقة زاوية), كنت حقا ينبغي أن يكون خلق من غير جافا سكريبت النسخة للتحرير ثم إضافة تعديل في المكان باستخدام جافا سكريبت بعد تحميل الصفحة ، reffered التحسين التدريجي.

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

Answer 2

لا يمكنك تعديل في المكان بدون جافا سكريبت ، لذلك تدهور رشيقة لأنه يتكون من التأكد من أن المستخدم لا يزال يمكن تعديل هذا البند في السؤال عندما جافا سكريبت غير متوفر.

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

Answer 3

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

Answer 4

ربما وضع الإدخال في شعبة تحت كل عنصر يحتوي على تعديل في المكان.عند تحميل الصفحة ، استخدام جافا سكريبت لإخفاء تلك divs.أن الطريقة التي سوف تكون قابلة للاستخدام إذا كان جافا سكريبت أبدا الحرائق.

Answer 5

أنا asuming ما كنت تحاول القيام به هو شيء من هذا القبيل السيناريو التالي:

<li>
    <span id="editable">Editable text</span> <a class="edit_button"> </a>
</li>

حيث <a> هو الزر الذي يستبدل <span> مع <input>, بحيث يمكن تحريرها.هناك عدة طرق لجعل هذا تتحلل برشاقة (أي تعمل دون جافا سكريبت).

من الناحية النظرية:

باستخدام CSS, تفعل ذلك مع الزائف محددات.:نشط إلى حد ما مثل onclick الحدث ، لذلك إذا كنت عش خفية <input> في <li>هذا CSS يخفي <span> ويظهر <input> عندما يكون لى هو النقر على.

li:active #editable {
    display:none;
}
li:active input{
    display:block;
}

هذه قد تعمل في متصفح المفضلة لديك ، ولكن عليك دون شك تجد أنه يكسر في IE.

في الممارسة:

استخدام وصلة.يجب أن <a> تكون فعلية الرابط الذي يذهب إلى صفحة حيث هذا الإدخال/span الاستبدال تم القيام به من جانب الخادم.كنت عصا معالج الحدث على <a> أن يستخدم MooTools إلى إلغاء الحدث انقر فوق للأشخاص الذين لديهم JS, مثل هذا:

function make_editable(evt) {
    var evt = new Event(evt);
    evt.preventDefault();
}

Answer 6

حاول استخدام الإدخال على غرار النص ، وبعد تحميل الصفحة جعله للقراءة فقط باستخدام سمة للقراءة فقط.و عندما اضغط على قم بإزالة سمة للقراءة فقط ، onblur جعلها للقراءة فقط مرة أخرى.عند النقر على زر "حفظ" أو على الحدث onblur تقديم طلب اياكس إلى حفظ البيانات في الخادم.