Блог

Главная - Вопросы по программированию - Javascript отображение динамического содержимого

Javascript отображение динамического содержимого

#javascript

#javascript

Вопрос:

Я хотел отобразить другое сообщение в том же <div> самом, когда пользователь делает выбор с помощью переключателя. Это работает, но не так чисто, как хотелось бы. Вот код:

 <script type="text/javascript">
    function showhide(t) {
        var target = document.getElementById('bankingdetails');
        if (target.style.display == 'none') {
            var text = 'Please effect payment to the following account:<br />';
            var accountnum = 'Account Number: 39485620346<br />';
            var branchcode = 'Branch Code: 34985<br />';
            var branchname = 'Branch: F00 Bank Whoville';
            if (t == 0) {
                // User opted for Online Payment
                target.style.display = 'block';
                target.innerHTML = 'Please click here to go to PayPal:<br /><a href="http://www.paypal.com">Go to PayPal</a>';
            } else {
                target.style.display = 'block';
                target.innerHTML = text   accountnum   branchcode   branchname;
            };
        } else {
            target.style.display = 'none';
        };
    };
</script>

<input type="radio" name="radPayment" onclick="showhide(0);" />Pay Online
<input type="radio" name="radPayment" onclick="showhide(1);" />EFT

Прямо сейчас я могу щелкнуть любой переключатель, чтобы отобразить его сообщение, но… Я должен щелкнуть его снова или щелкнуть по другому, чтобы скрыть видимое сообщение.

Я бы хотел изменить текст, отображаемый на странице, чтобы, если текст EFT был виден, если я нажму на кнопку «Оплатить онлайн», текст немедленно изменится.

Заранее спасибо!

Комментарии:

1. Не уверен, какова желаемая логика .. можете ли вы лучше объяснить, чего вы ожидаете?

2. Да, вы хотите, чтобы сообщение скрывалось через некоторое время? Какова ваша цель?

Ответ №1:

Если я вас правильно понимаю, многократное нажатие приводит к скрытию / отображению div. Вы можете решить эту проблему, всегда проверяя заданный параметр t:

 <script type="text/javascript">
    function showhide(t) {
        var target = document.getElementById('bankingdetails');

        var text = 'Please effect payment to the following account:<br />';
        var accountnum = 'Account Number: 39485620346<br />';
        var branchcode = 'Branch Code: 34985<br />';
        var branchname = 'Branch: F00 Bank Whoville';
        switch(t)
        {
            case 0:
                // User opted for Online Payment
                target.style.display = 'block';
                target.innerHTML = 'Please click here to go to PayPal:<br /><a href="http://www.paypal.com">Go to PayPal</a>';
                break;
            case 1:
                target.style.display = 'block';
                target.innerHTML = text   accountnum   branchcode   branchname;
                break;
            default:
                 target.style.display = 'none';
        }
    };
</script>