X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Подскажите, как реализовать скрипт с условиями
FerrisBuller
FerrisBuller
Topic Starter сообщение 5.10.2013, 17:37; Ответить: FerrisBuller
Сообщение #1


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

Вот пояснение:

в первом селекте выбираем цвет предмета, справа меняется фотка в зависимости от цвета.
во втором селекте, выбираем нужное свойст-во, фотка опять меняется.
в третьем селекте, в зависимости от 1 и 2 селекта, появляются возможные свой-ва, выбираем и фотка опять меняется
четвертый селекст, закрывается если выбрали определенную опцию в 2 или 3 селекте (допустим выбирали рубашки, в 3 селекте выбрали короткий рукав, а 4 селект был допусти "добавить запонки")
и т.д.

Думаю идея понятно,

Заранее спасибо!
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
andreykashops
andreykashops
сообщение 5.10.2013, 23:25; Ответить: andreykashops
Сообщение #2


А чем Вам помочь?
JS(JQuery)+ручки и все реализуется, вроде как и не особо сложно, если все статическое выводится.

Работа с селектором продемонстрирована избыточно тут http://www.webnotes.com.ua/index.php/archives/699


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Ultrastalker
Ultrastalker
сообщение 6.10.2013, 10:06; Ответить: Ultrastalker
Сообщение #3


FerrisBuller, в таких случаях на каждый select вешается свойство Jscript "onchange=имя_скрипта". "Имя скрипта" — это скрипт, который отправляет серверу асинхронный запрос и меняет свойство src соответствующей картинки. Нечто похожее у меня реализовано на главной странице сайта avtomag.su, в левой колонке внизу — там в зависимости от выбора марки автомобиля автоматически меняется список моделей во втором селекторе. Асинхронный запрос направляется либо отдельному скрипту на сервере (который формирует соответствующую выборку для нужного селектора), либо общему скрипту, но со специальным параметром (который указывает на специальное соответствующее назначение запроса). Также рекомендую обратить внимание на опции + и ~ CSS-стилей, очень полезная штука, в связке с указанным методом даёт отличные результаты.


--------------------
Счастье для всех, даром, и пусть никто не уйдёт обиженным!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FerrisBuller
FerrisBuller
Topic Starter сообщение 6.10.2013, 23:31; Ответить: FerrisBuller
Сообщение #4


andreykashops, Ultrastalker,

связать то, я могу, но как сделать, чтобы после каждого изменения фотка менялась в правой колонки таблице.
я понимаю, что нужно для каждого варианта сделать фотку, но как 2 события засунуть в onchange не знаю

Вот, как выглядит у меня скрипт, сейчас:

<body>
<script language="JavaScript">
<!--
function l_image (a)
{
document.images [0] .src=a
}
-->
</script>  
<table cols="2" width="90%" border="0">
<tr><td>
    <p><select id="List1" onchange="document.images[0].src=this.options[this.selectedIndex].value">
    <option value="white">White</option>
    <option value="black">Black</option>
    </select></p>
    <p><select id="List2"></select></p>
    <p><select id="List3"></select></p></td>
<td align="center" valign="center"><img src="http://testmagaz.tw1.ru/wp-content/themes/magaz15/white/000.jpg" name="tool" ></td>
</tr>
</table>

<script type="text/javascript">
var syncList1 = new syncList
syncList1.dataList = {

    'white':{
        'white_1':'обычная',
        'white_2':'приталинная'
    },    
    'black':{
        'black_1':'обычная ч',
        'black_2':'приталинная ч'
    },    
    'white_1':{
        'white_1_1':'обычная с 2 пуговицами',
        'white_1_2':'обычная с 3 пуговицами'
    },
    'white_2':{
        'white_2_1':'приталинная с 2 пуговицами',
        'white_2_2':'приталинная с 3 пуговицами'
    },
    'black_1':{
        'black_1_1':'обычная ч с 2 пуговицами',
        'black_1_2':'обычная ч с 3 пуговицами'
    },
    'black_2':{
        'black_2_1':'приталинная с 2 пуговицами',
        'black_2_2':'приталинная с 3 пуговицами'
    }
};

syncList1.sync("List1","List2","List3");
</script>


</body>


Результат можно видеть по адресу http://testmagaz.tw1.ru, вот как мне к значению value, ещё присобачить фотку?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Ultrastalker
Ultrastalker
сообщение 7.10.2013, 7:49; Ответить: Ultrastalker
Сообщение #5


FerrisBuller, прошу извинить, безотносительно к приведённому вами коду — за недостатком времени. По шагам.
1. Есть картинка, тег: <img src="путь к картинке" id="image01">, её содержимое будет меняться по событию "onchange" селектора из п. 2.
2. Есть селектор типа <select>, тэг: <select id="myselector" onchange="changeimage();changenextselector();">.
3. Есть подчинённый селектор типа <select>, тэг: <select id="changedselector" onchange="changeimage();changenextselector();">, его содержимое будет меняться по событию "onchange" селектора из п. 2.
4. В начале страницы есть указание подключенного JS-скрипта, скажем, "context.js", тег: <script language="JavaScript" type="text/javascript" src="http://путь к скрипту/context.js"/>. В этом скрипте есть две функции — changeimage() и changenextselector(). По событию onchange селектора "myselector" последовательно запускаются обе этих функции: одна меняет содержимое следующего селектора, вторая — содержимое тега img. Для поиска нужного элемента используется document.getElementById("атрибут"), где "атрибут" соответственно — "image01" для картинки и "changedselector" для второго селектора.

Вот примерно так. Ничего сложного.
P. S. Возможно, вопрос в том, как впихнуть в ваш код сразу два обработчика? Через точку с запятой. И код лучше не впихивать непосредственно в onchange, а разместить в отдельном скрипте, как показано в данном сообщении, в onchange же через точку с запятой перечислить названия функций-обработчиков. И не забывайте, что при необходимости в JS-функции можно передавать значения, указывая их в скобках, например, так: onchange="changeimage(this.value)".

Сообщение отредактировал Ultrastalker - 7.10.2013, 7:55


--------------------
Счастье для всех, даром, и пусть никто не уйдёт обиженным!


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FerrisBuller
FerrisBuller
Topic Starter сообщение 8.10.2013, 18:32; Ответить: FerrisBuller
Сообщение #6


Ultrastalker,

Спасибо за помощь, но можно увидеть ответ относительно моего скрипта, я пока ещё слаб в программировании, уже столько убил времени, а результат не получил...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Ultrastalker
Ultrastalker
сообщение 8.10.2013, 20:56; Ответить: Ultrastalker
Сообщение #7


FerrisBuller, сожалею, всем, чем мог, я постарался вам помочь. Проблема в том, что я могу помочь, но у меня нет возможности выполнить задачу за вас — для этого надо вникать в ваш код. Без обид. В вашем распоряжении есть сайт avtomag, ссылку на который я привёл выше, есть Opera, есть Стрекоза, скачать и проанализировать нужный скрипт дело пары часов даже при отсутствии навыков программирования. В конце концов, просто наберите в Гугле "AJAX синхронные и асинхронные запросы", там всё разжёвано до полного безобразия, если мои советы вам не помогли. В конце концов, попробуйте найти фрилансера, который вам это сделает, ничего зазорного в этом нет, у каждого своя специализация, мне WEB-студии, к примеру, в своё время разработку скриптов заказывали (только просьба не принимать это за рекламу услуг!)

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.


--------------------
Счастье для всех, даром, и пусть никто не уйдёт обиженным!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Большие ставки для кликов в Я.Директ. Как удешевить?
2 rownong27 1117 26.3.2024, 14:13
автор: knezevolk
Открытая тема (нет новых ответов) Как вы бросили работу и перешли на заработок с сайтов?
12 uahomka 2285 25.3.2024, 6:52
автор: Skyworker
Открытая тема (нет новых ответов) Как отозвать банковский платеж фрилансеру?
28 metvekot 3911 25.3.2024, 6:34
автор: Skyworker
Открытая тема (нет новых ответов) Как вывести деньги в Украине с заблокированного Юмани ?
23 freeax 3636 24.3.2024, 20:55
автор: Liudmila
Открытая тема (нет новых ответов) Через какой браузер и как можно найти в кэшэ браузера видео
10 Room 1929 23.3.2024, 7:41
автор: Room


 



RSS Текстовая версия Сейчас: 28.3.2024, 17:51
Дизайн