首页 > 解决方案 > Tampermonkey 单击以从下拉列表中选择什么都不做

问题描述

我正在尝试编写 Tampermonkey Javascript 代码来选择网站上的下拉菜单项。我尝试的各种选项什么都不做(下面的代码)。我究竟做错了什么?打印控制台日志显示(根据我的初学者级别的解释)找到并单击了下拉按钮:

Object { 0: select#i_expires
, length: 1, context: HTMLDocument example.com/sub.cfm?vi=0, selector: "#i_expires" }
Object { type: "click", timeStamp: 1615389769372, jQuery1705971719886727317: true, isTrigger: true, exclusive: undefined, namespace: "", namespace_re: null, result: undefined, target: select#i_expires
, delegateTarget: HTMLDocument example.com/sub.cfm?vi=0, … }
Object { context: HTMLDocument example.com/sub.cfm?vi=0, selector: "#expires_cancel" }

Tampermonkey 脚本:

    // ==UserScript==
// @name         Select account
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Select the correct account and other transaction parameters.
// @author       Sander Heinsalu
// @match        example.com/sub.cfm?vi=0
// @icon         https://www.google.com/s2/favicons?domain=tampermonkey.net
// @require      http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require      https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    //$("#i_expires").val("expires_cancel").change(); //never triggered 

    /*
    function selectDuration (){
    var duration = document.getElementById("i_expires");
        for(var i = 0;i < duration.options.length;i++){
            //if(duration.options[i].value == "cancel" ){
            if(duration.options[i].id == "expires_cancel" ){
                duration.options[i].selected = true;
            }
        }
    }
    */

    //$("#i_expires").val("expires_cancel").change(); //This and the following do not work.
    //$("#expires_cancel").val("cancel").change();
    //$("#select grid2").val("cancel").change();
    //$("#select grid2 focus").val("cancel").change();
    //$("//*[@id='i_expires']").val("cancel").change();
    $(document).ready(function() {
        $("id:contains('i_expires')").click();
        //$("id:'i_expires'").click();
        $("select:contains('i_expires')").click();
    });
    $('#i_expires').attr('expires_1d', 'expires_cancel');
    //document.getElementById('i_expires').click();
    
    $('#i_expires').click();
    $('#expires_cancel').click();
    $('#expires_cancel').click().change();
$('#i_expires').change(function() {
    $('#expires_cancel').click();
    this.options['#expires_cancel'].click();
});

    /*
    $(window).on('load', function() { // Does not print anything to the log.
        console.log( $('#expires_cancel') );
        $('#expires_cancel').click(function(e){ console.log( e ) } );
        $('#expires_cancel').click();
    });
    */

    $(document).ready(function() { /*
    Prints
Object { 0: select#i_expires
, length: 1, context: HTMLDocument example.com/sub.cfm?vi=0, selector: "#i_expires" }
Object { type: "click", timeStamp: 1615389769372, jQuery1705971719886727317: true, isTrigger: true, exclusive: undefined, namespace: "", namespace_re: null, result: undefined, target: select#i_expires
, delegateTarget: HTMLDocument example.com/sub.cfm?vi=0, … }
Object { context: HTMLDocument example.com/sub.cfm?vi=0, selector: "#expires_cancel" }
        */
        console.log( $('#i_expires') );
        $('#i_expires').click(function(e){ console.log( e ) } );
        $('#i_expires').click();
    });

    $(document).ready(function() { //Prints only one line in the log: Object { context: HTMLDocument hexample.com/sub.cfm?vi=0, selector: "#expires_cancel" }
        console.log( $('#expires_cancel') );
        $('#expires_cancel').click(function(e){ console.log( e ) } );
        $('#expires_cancel').click();
    });


})();

HTML:

<div class="field-row ">
                        <label for="i_expires">Duration</label> 
                        <span class="select grid2" style="position: relative; width: 83px;">
<select name="i_expires" id="i_expires" style="width: 100%; visibility: visible;">
<option id="expires-1d" value="1d" selected="selected">end of day</option>
<option id="expires-cancel" value="cancel">until cancelled</option>
</select><span class="value" style="width: 104px;">until cancelled</span></span>
                        </div>

标签: javascripttampermonkey

解决方案


推荐阅读