تعيين وظيفة جافا سكريبت بشكل مشروط بعد نشر النموذج

Question

اعتذار عن جداً السؤال الأساسي - دورة تدريبية مكثفة في جافا سكريبت قادمة!ولكن قبل ذلك، لدي وظيفة جافا سكريبت:

 function toggle(request)

تقوم الوظيفة ببساطة بتبديل div إلى مرئي/غير مرئي.يمكنني تشغيل السلوك الذي أريده من هذه الوظيفة باستخدام عند النقر الحدث على النحو التالي:

<input type="radio" name="complete" value="true" id="complete_yes" 
onclick="toggle('true');"/>

يعمل هذا بشكل جيد، ولكن بعد نشر نموذج، في ظل ظروف معينة، أريد تحديد زر الاختيار تلقائيًا وتعيين وظيفة جافا سكريبت تلقائيًا على:

toggle('true') 

...وبالتالي الكشف عن محتويات div.لقد عملت على الجزء "المحدد" ، ولكن كيف يمكنني ضبط وظيفة جافا سكريبت بشكل مشروط على "صحيح" أيضًا؟

<input type="radio" name="complete" value="true" {if $data.complete == true}checked{/if} id="complete_yes" 
onclick="toggle('true');"/>

Answer 1

وقررت أن تتعلم مسج بدلا من ذلك! بناء الجملة يحقق أدناه النتيجة المرجوة وليس للصيانة جدا!

$(document).ready(function () {
 $('#complete_yes').toggle(function () {
    $('#repair_complete').removeClass('hidden');
 }, function() {
    $('#repair_complete').addClass('hidden');
});
});

Answer 2

ماذا عن الاختبار في JS الخاص بك toggle وظيفة، إذا كان يجب أن يكون div مرئيًا أم لا اعتمادًا على الحالة "المحددة" للإدخال الخاص بك؟

شيء من هذا القبيل قليلا، على ما أعتقد:

function toggle()
{
    if (document.getElementById('YOUR_INPUT_ID').checked) {
        document.getElementById('YOUR_DIV_ID').style.display = 'block';
    } else {
        document.getElementById('YOUR_DIV_ID').style.display = 'none';
    }
}

لم يتم اختباره على الإطلاق، ولكن أعتقد أنك ستحصل على الفكرة :-)
(لا أعرف أبدًا ما إذا كان الإدخال الذي يعتبر "محددًا" قبل أو بعد وظيفة JS عند النقر يسمى ...لذلك قد تضطر في الواقع إلى عكس "block' و 'none' إعدادات)

وإذا كان لديك عدة مدخلات/أقسام، فيمكنك تمرير معرفاتها كمعلمات إلى الملف toggle وظيفة...

وبهذه الطريقة، لن تضطر أبدًا إلى القلق بشأن أي نوع من "التهيئة" لهذه الوظيفة.

لاحظ أنه يمكنك أيضًا اختبار ما إذا كان div مرئيًا، باستخدام شيء مثل هذا:

function toggle()
{
    if (document.getElementById('YOUR_DIV_ID').style.display == 'none') {
        document.getElementById('YOUR_DIV_ID').style.display = 'block';
    } else {
        document.getElementById('YOUR_DIV_ID').style.display = 'none';
    }
}

(لم يتم اختباره أيضًا)

بهذه الطريقة، ستكون وظيفتك حقًا تبديل يتم عرض div في كل مرة يتم استدعاؤها.

Answer 3

لماذا لا تفعل شيئا مثل:

{if $data.complete == true}
<script type="text/javascript">toggle('true');</script>
{/if}