Изменение страницы из скрипта Greasemonkey, когда выбран конкретный <option> - PullRequest
Новая
       5

Изменение страницы из скрипта Greasemonkey, когда выбран конкретный <option>

1 голос
/ 05 июля 2010

При написании скрипта GreaseMonkey с использованием jQuery и "tamtam" у меня возник вопрос:

Есть страница (которую я не могу редактировать), имеющая элемент <select> с четырьмя параметрами.Предварительно выбран вариант 2. 

<select id="idname" name="namename">
  <option>Option1</option>
  <option selected="selected">Option2</option>
  <option>Option3</option>
  <option>Option4</option>
</select>

Теперь я хотел бы вызвать сценарий, когда выбран вариант 1.Вариант 1 ведет на другой сайт, я хочу вставить свой сценарий.

Как бы я написал что-то вроде: 

if (Option1 is selected) {
    perform the script
}

Хотелось бы что-то вроде следующей работы? 

if(document.getElementById("idname").getElementsByTagName("option")[0].onselect == true){
    perform the script 
}

Если нет, можете ли вы опубликовать ссылку, помогающую мне?

Редактировать

Мне удалось создать функцию и обработчик событий. 

function myCompute(Event) {
    with (this) {  
        var myTest = value;

        if (value == "option1") {
            $("#tabelle").show();
        }

        else {
            $("#tabelle").hide();
        }
    }
}

Обработчики событий: 

$("#option-type").change (myCompute);
$("#tabelle").hide();

Работает следующим образом: При выборе опции 2,3 или 4 таблица скрывается.При выборе варианта 1 отображается таблица.При посещении сайта вариант 2 выбирается большую часть времени и ничего не отображается.Теперь я понял, что вариант 1 выбран при посещении сайта, и таблица также не отображается.Моя идея состояла в том, что таблица должна отображаться, когда опция 1 выбрана. Я думаю, что EventHandler отсутствует.Как и вы, сказал Брок Адамс. 

$("#option-type option:first").select (myCompute);
$("#option-type").change (myCompute);
$("#tabelle").hide();

Если я свяжу функцию с $("#tabelle").hide();, таблица будет скрыта с самого начала.При изменении опций на option1 отображается таблица.Как я могу показать таблицу, когда выбран вариант 1, и как скрыть таблицу, когда выбран вариант 2,3,4?

Попытка option:first приводит к ошибке «неизвестный псевдоэлемент».

Ответы [ 2 ]

1 голос
/ 05 июля 2010

Обновление:

Хорошо, если я понимаю пересмотренный вопрос, код теперь работает так, как задумано, за исключением случаев, когда вариант 1 запускается как выбранный.(PS, идентификаторы данного кода должны быть отредактированы, чтобы соответствовать.)

Если это правда, тогда просто измените эту строку: 

$("#tabelle").hide();

.
На это: 

if ($("#option-type")[0].selectedIndex == 0 )
    $("#tabelle").show();
else
    $("#tabelle").hide();

В Greasemonkey вы не можете установить обработчики событий таким образом из-за защиты песочницы.См. Распространенные ошибки в Greasemonkey .
Кроме того, в jQuery есть более простые способы выбора этого элемента.

Что-то вроде: $("#idname option:first").select (YourEventHandler) должно работать.

Где: 

function YourEventHandler (Event)  
{
    //YOUR CODE HERE
    //Note: Event is a variable passed automatically to all event handlers, you often just ignore it.
}

Удобный справочник jQuery .

0 голосов
/ 05 июля 2010

Вы можете использовать свойство .selectedIndex , чтобы узнать, какой из них выбран, например: 

if(document.getElementById("idname").selectedIndex === 0) { //option 1
  //perform the script
}

Это индекс на основе 0, поэтому в вашем примере разметки 0 равен Option 1, вы можете протестировать / поиграть с ним здесь .

Мне непонятно из вопроса, но если вы хотите это на событии change, это выглядело бы так: 

document.getElementById("idname").onchange = function() {
  if(this.selectedIndex === 0) {
    //perform the script
  }
};

Вы не можете проверить это здесь .

...