Измените все содержимое div на выбор опции из раскрывающегося списка

Я хочу изменить div-содержимое, где когда-либо div используется с тем же именем, код работает нормально, но только меняет содержимое первого div, что мне делать? Код приведен ниже.Измените все содержимое div на выбор опции из раскрывающегося списка

<select id="select" name="cd-dropdown" class="cd-select"> 
<option value="-1" selected>Currency</option> 
<option value="1">Dollar $</option> 
<option value="2">Pound £</option> 
<option value="3">Rupees </option> 
<option value="4">Dirham </option> 
</select> 



<script> 
$(document).ready(function() { 
$('.pr-price').hide(); 
$('#2').show(); 
$('#select').change(function() { 
    $('.pr-price').hide(); 
    $('#'+$(this).val()).show(); 
}); }); 

<div id="1" class="pr-price">$100</div> 
<div id="2" class="pr-price">£200</div> 
<div id="3" class="pr-price">Rs300</div> 
<div id="4" class="pr-price">D400</div>

источник

2014-02-20 Ibad_Pak

Работы [здесь] (http://jsfiddle.net/6et39/)! –

уже работает – Dexture

Он будет работать в браузерах, совместимых с HTML5, но не во всех, а не в некоторых DOCTYPE. – mplungjan

Это происходит потому, что вы используете ID, если вы хотите работать в нескольких местах, используйте Class

Working Demo

Код

$(function() { 
    $('.pr-price').hide(); 
    $('.d2').show(); 

    $('#select').on("change",function() { 
    $('.pr-price').hide(); 
    $('.d'+$(this).val()).show(); 
    }).val("2"); 
});

HTML

<div class="pr-price d1">$100</div> 
<div class="pr-price d2">£200</div> 
<div class="pr-price d3">Rs300</div> 
<div class="pr-price d4">D400</div>

источник

2014-02-20 11:57:05

Спасибо, брат, это работает :) –

Рад, что я мог бы помочь :-) Отметьте это как ответ, который вам помог. –

@SurjithSM У вас была отличная отправная точка, я бы сказал ... – mplungjan

Чтобы использовать более одного DIV, использование классов

Live Demo

$(function() { 
    $('.pr-price').hide(); 
    $('.d2').show(); 
    $('#select').on("change",function() { 
    $('.pr-price').hide(); 
    $('.d'+$(this).val()).show(); 
    }).val(2); // reflect the div shown 
});

с использованием

<div class="pr-price d1">$100</div> 
<div class="pr-price d2">£200</div> 
<div class="pr-price d3">Rs300</div> 
<div class="pr-price d4">D400</div> 
<hr/> 
<div class="pr-price d1">$500</div> 
<div class="pr-price d2">£600</div> 
<div class="pr-price d3">Rs700</div> 
<div class="pr-price d4">D800</div>

При использовании идентификаторов вы должны изменить идентификатор не быть числовым - Числовой идентификатор будет работать в некоторых (HTML5-совместимых), но не во всех браузерах

Live Demo

$(function() { 
    $('.pr-price').hide(); 
    $('#d2').show(); 
    $('#select').on("change",function() { 
    $('.pr-price').hide(); 
    $('#d'+$(this).val()).show(); 
    }).val(2); // reflect the div shown 
});

использованием

<div id="d1" class="pr-price">$100</div> 
<div id="d2" class="pr-price">£200</div> 
<div id="d3" class="pr-price">Rs300</div> 
<div id="d4" class="pr-price">D400</div>

источник

2014-02-20 10:44:51 mplungjan

. Уважаемый всех, я знаю, что он работает отлично, но тот же div используется в других местах. Также я хочу изменить контент везде, где этот div используется на веб-сайте но его единственное изменение на первом div на странице –

Извините, я был вдали от своей клавиатуры – mplungjan

То, что вы сделали правильно. За исключением указания только числового значения в id. ID не может быть числовым. Изменить идентификатор в

<div id="price1" class="pr-price">$100</div> 
<div id="price2" class="pr-price">£200</div> 
<div id="price3" class="pr-price">Rs300</div> 
<div id="price4" class="pr-price">D400</div>

также изменить

$('#select').change(function() { 
    $('.pr-price').hide(); 
    $('#price'+$(this).val()).show(); 
});

это должно помочь.

источник

2014-02-20 10:52:17 Bala

Измените все содержимое div на выбор опции из раскрывающегося списка

ответ

Смежные вопросы