Question

我在将一个html元素传递给jQuery时遇到了问题。我知道使用attr()我们可以访问属性。不过我觉得我做错了。

这是我简单的jQuery函数：

<script type="text/javascript">
    function test(value) {
        alert(value);
    }
</script>

我有一个由foreach循环创建的动态列表框：

<select  multiple="multiple" name="factors1" id="main_factors" style="width: 200px; height: 200px;">

<?php foreach ($array as $option): ?>
    <option onclick="test(<script>this.attr('title').value</script>);"
            id="<?php echo $option[0]; ?>"
            title="<?php echo $option[2]; ?>" 
            value="<?php echo $option[0]; ?>">
        <?php echo $option[1]; ?>
    </option>
<?php endforeach ?>

</select>

我希望当有人点击列表框中的项目时，其项目会显示在我的消息框中。但是这段代码对我不起作用。

onclick="test(<script>this.attr('title').value</script>);"

如何从onclick属性向我的函数发送title属性值？

提前致谢。

Answer 1

onclick="test(this)"

function test(value)
{
    alert($(value).attr('title'));
}

see demo

Answer 2

试试这段代码。我认为你在代码中犯了错误。

<select  multiple="multiple" name="factors1" id="main_factors" style="width: 200px; height: 200px;" onchange="test(this.value);">

<?php foreach ($array as $option): ?>
<option id="<?php echo      $option[0]; ?>" title="<?php echo $option[2]; ?>" 
value="<?php  echo $option[0]; ?>"><?php echo $option[1]; ?></option>
<?php endforeach ?>


</select>

在你的jQuery中：

<script type="text/javascript">
    function test(value)
       {
        alert(value);
       }
    </script>

Answer 3

您应该在onchange元素上使用select事件。

<select onchange="test(this.value)">

<强> JavaScript的：

function test(value) {
    alert(value)        
}

SEE DEMO

Answer 4

由于您已导入并正在使用jQuery，因此最好将事件处理程序与html元素分开，作为设计与功能的分离：

从你的php中删除onclick：

<select  multiple="multiple" name="factors1" id="main_factors" style="width: 200px; height: 200px;">
<?php foreach ($array as $option): ?>
<option id="<?php echo $option[0]; ?>" title="<?php echo $option[2]; ?>" 
value="<?php  echo $option[0]; ?>"><?php echo $option[1]; ?></option>
<?php endforeach ?>
</select>

将函数绑定到javascript中的change事件：

$(document).ready(function() {
    $('#main_factors').change( function() {
        test( $(this).val() );
        // you can also do:
        // test( this.value );
    });
});

function test(value)
{
    alert(value);
}

从onclick事件将HTML属性传递给jQuery函数

4 个答案: