Question

我对JavaScript很新，我无法弄清楚为什么这不会起作用。我的朋友说要尝试使用import java.awt.*; import java.awt.event.*; import javax.swing.*; public class DarkIcon implements Icon { private Icon icon; private Color color; private boolean dark = false; public DarkIcon(Icon icon, Color color) { this.icon = icon; this.color = color; } public void setDark(boolean dark) { this.dark = dark; } @Override public int getIconWidth() { return icon.getIconWidth(); } @Override public int getIconHeight() { return icon.getIconHeight(); } @Override public void paintIcon(Component c, Graphics g, int x, int y) { icon.paintIcon(c, g, x, y); if (dark) { g.setColor(color); g.fillRect(x, y, getIconWidth(), getIconHeight()); } } public static void main(String[] args) { SwingUtilities.invokeLater(new Runnable() { public void run() { createAndShowGUI(); } }); } public static void createAndShowGUI() { Icon icon = new ImageIcon("mong.jpg"); DarkIcon darkIcon = new DarkIcon(icon, new Color(0, 0, 0, 128)); JLabel label = new JLabel( darkIcon ); Action blink = new AbstractAction() { @Override public void actionPerformed(ActionEvent e2) { darkIcon.setDark( false ); label.repaint(); } }; Timer timer = new Timer(2000, blink); timer.setRepeats( false ); JButton button = new JButton("Blink Icon"); button.addActionListener( new ActionListener() { @Override public void actionPerformed(ActionEvent e) { darkIcon.setDark(true); label.repaint(); timer.restart(); } }); JFrame f = new JFrame(); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.add(label); f.add(button, BorderLayout.SOUTH); f.pack(); f.setLocationRelativeTo( null ); f.setVisible(true); } }或.click来测试对该选项的点击，但其中有一些是有效的。

我的HTML ：

.select

我的JavaScript ：

<body>
<form>General
    <hr>Full Name:
    <br>
    <input Type="text" name="name">
    <br>Gender:
    <br>
    <input type="radio" Name="gender" value="Male">Male
    <input Type="radio" name="gender" value="female">Female
    <br>Birthday:
    <br>
    <input type="text" name="bday" placeholder="mm/dd/yy">
    <br>Email Adress:
    <br>
    <input type="text" name="email">
    <br>PayPal address:
    <br>
    <input type="text" name="PayPal" placeholder="for when we start paying staff">
    <br>Short Biography:
    <br>
    <textarea rows="4" cols="50"></textarea>
    <br>
    <br>Apply:
    <hr>Username:
    <br>
    <input type="text" name="nick" placeholder="Your Ingame Name">
    <br>What Rank Are You Applying For:
    <br>
    <select>
        <option id="Dev" value="Developer">Developer</option>
        <option id="Headadmin" value="HeadAdmin">Head Admin</option>
        <option id="Headmod" value="HeadMod">Head Modetator</option>
        <option id="Headbuilder" value="HeadBuilder">Head Builder</option>
        <option id="admin" value="Admin">Admin</option>
        <option id="mod" value="Moderator">Moderator</option>
        <option id="builder" value="Builder">Builder</option>
    </select>
    <br>Why do WE want you (Rank you picked above):
    <br>
    <textarea rows="4" cols="50"></textarea>
    <br>How Many Hours Can You Be On a day:
    <br>
    <input type="text" name="day">
    <br>how many days can you be on a week:
    <br>
    <input type="text" name="week">
    <br>have you been staff before?
    <br>
    <select>
        <option value="yes">yes
            <option value="no">no</select>
    <br>Test:
    <hr>
    <div id="DevTest">Devtest</div>
    <div id="admintest">admin test</div>
    <div id="modtest">mod test</div>
    <div id="HAtest">head admin test</div>
    <div id="HMtest">head mod test</div>
    <div id="HBtest">headbuilder test</div>
    <div id="buildertest">buildertest</div>
    <br>
    <hr>
    <textarea readonly rows="5" cols="30">Staff Contract: ---------------- 1. As a staff member, YOU, are represent the "Piggalot Gaming Network" both online and offline. this means; A. If WE, The "Piggalot Gaming Network" Community,</textarea>
    <hr>
    <input type="checkbox" value="test" required>by clicking this you agree to the staff contract
    <br>
    <input type="reset">
    <input type="submit" value="Send Application">
</form>

这里是指向它的小提琴的链接：http://jsfiddle.net/a2nw2sus/1/

Answer 1

<option>不起作用。请改为change中的<select>代替：

$('#id_for_your_select').change(function () {
    var selected_value = $(this).val();
    switch (selected_value) {
        case 'Developer': {
            // do something
            break;
        }
        case 'HeadAdmin': {
            // do something else
            break;
        }
    }
});

在http://jsfiddle.net/a2nw2sus/2/我修正了拼写错误（click() vs Click()），而且：它在Chrome中不起作用。在Firefox中它可以工作，但你不能认为这是理所当然的！

Answer 2

您没有选择像您这样的选项。您的意思是为select菜单提供参考（ID /类/名称），然后选择它。

<select id="mySelectMenu">
    <option value="Developer">Developer</option>
    <option value="HeadAdmin">Head Admin</option>
    <option value="HeadMod">Head Modetator</option>
    <option value="HeadBuilder">Head Builder</option>
    <option value="Admin">Admin</option>
    <option value="Moderator">Moderator</option>
    <option value="Builder">Builder</option>
</select>

如果您只想检测选择的点击：

$('#mySelectMenu').click(function() {
    var currentValue = $(this).find(":selected").val();
    console.log("The current selected option is "+ currentValue +".");
});

或者您希望在检测到更改后获得select的值：

$('#mySelectMenu').on('change', function() {
    var selectedValue = $(this).val();
    if (selectedValue === "Dev") {
        $("#DevTest").show();
        $("#HAtest, #HMtest, #HBtest, #adminTest, #modtest, #buildertest").hide();
    } else if (selectedValue === "HeadAdmin") {
        $("#HAtest").show();
        $("#DevTest, #HMtest, #HBtest, #adminTest, #modtest, #buildertest").hide();
    }
});

javascript - 如何在<option>上使用.click

2 个答案: