Javascript 如何检查是否单击了单选按钮?

Javascript 如何检查是否单击了单选按钮?,javascript,jquery,button,click,radio,Javascript,Jquery,Button,Click,Radio,我的代码如下所示: form action="familytree.php" method="post"> <?php foreach ($spouses as $spouse) { if (!empty($spouse['mname'])) { $name = $spouse['fname'].' '.$spouse['lname'].' ('.$spouse['mname'].')'; } else { $name

我的代码如下所示:

form action="familytree.php" method="post">
<?php
foreach ($spouses as $spouse) {
    if (!empty($spouse['mname'])) {
        $name = $spouse['fname'].' '.$spouse['lname'].' ('.$spouse['mname'].')';
    }
    else {
            $name = $spouse['fname'].' '.$spouse['lname'];
    }
    if ($spouse['ended'] == '1') {
        $married = '';
        $divorced = 'checked';
    }
    else {
        $married = 'checked';
        $divorced = '';
    }
    ?>
    <div class="form_section dates">
        <h3><?php echo $name; ?></h3>
        <p>
        <input type="radio" id="married_option" name="married_divorced_options" <?php echo $married; ?> value="1"/>
        <label for="edate">Married</label>&nbsp; &nbsp; &nbsp;  
        <input type="radio" id="divorced_option" name="married_divorced_options" <?php echo $divorced; ?> value="1"/>
        <label for="sdate">Divorced</label> 
        </p>
        <div class="half" style="display: inline">
            <input type="text" name="sdate_<?php echo $spouse['individual_id']?>" id="sdate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['start_date']; ?>" placeholder="Rašykite sutuoktuvių datą čia"/>
            <?php echo $this->formError->error("sdate_".$spouse['individual_id'].""); ?>
        </div>
        <div id="divorced" class="half" style="display:none">
            <input type="text" name="edate_<?php echo $spouse['individual_id']?>" id="edate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['end_date']; ?>" placeholder="Rašykite skyrybų datą čia"/>
            <?php echo $this->formError->error("edate_".$spouse['individual_id'].""); ?>
        </div>
    </div>
    <?php
    }
    ?>
    <p class="submit">
        <input class="first-btn" type="submit" id="edit-relationship" name="edit-relationship" value="Edit"/>&nbsp;
    </p>
    </form>
jQuery("#divorced_option").click(function() {
   document.getElementById("divorced").style.display = "inline-block";
});
jQuery("#married_option").click(function() {
   document.getElementById("divorced").style.display = "none";
});
$("input[id*=divorced_option]:checked");
我想知道的是,当你不知道单选按钮的全名,只知道它的一半时,如何检查它是否被点击。例如,离异选项不是全名,它应该类似于离异选项161,离异选项161。。。因此,代码应该检查是否单击了名称中包含“U”选项的单选按钮。有没有办法做到这一点

编辑 它与jQuery[id^='married_option']一起工作。单击函数{}。但是我忘了在我的原始问题中提到,元素discovered也不是全名,它应该是discovery_161,discovery_162,这取决于单击的单选按钮的名称。如何隐藏与单选按钮匹配的元素

使用ex.[name^=value]:

使用ex.[name^=value]:

看一看这张照片

选择器在这里很有用,这意味着您的代码将是:

jQuery("[id*='divorced_option']").click(function() {
    document.getElementById("divorced").style.display = "inline-block";
});
jQuery("[id*='married_option']").click(function() {
    document.getElementById("divorced").style.display = "none";
});
看一看这张照片

选择器在这里很有用,这意味着您的代码将是:

jQuery("[id*='divorced_option']").click(function() {
    document.getElementById("divorced").style.display = "inline-block";
});
jQuery("[id*='married_option']").click(function() {
    document.getElementById("divorced").style.display = "none";
});

在检查是否按如下方式选择元素时,您可以根据选项[number]模式选择元素:

form action="familytree.php" method="post">
<?php
foreach ($spouses as $spouse) {
    if (!empty($spouse['mname'])) {
        $name = $spouse['fname'].' '.$spouse['lname'].' ('.$spouse['mname'].')';
    }
    else {
            $name = $spouse['fname'].' '.$spouse['lname'];
    }
    if ($spouse['ended'] == '1') {
        $married = '';
        $divorced = 'checked';
    }
    else {
        $married = 'checked';
        $divorced = '';
    }
    ?>
    <div class="form_section dates">
        <h3><?php echo $name; ?></h3>
        <p>
        <input type="radio" id="married_option" name="married_divorced_options" <?php echo $married; ?> value="1"/>
        <label for="edate">Married</label>&nbsp; &nbsp; &nbsp;  
        <input type="radio" id="divorced_option" name="married_divorced_options" <?php echo $divorced; ?> value="1"/>
        <label for="sdate">Divorced</label> 
        </p>
        <div class="half" style="display: inline">
            <input type="text" name="sdate_<?php echo $spouse['individual_id']?>" id="sdate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['start_date']; ?>" placeholder="Rašykite sutuoktuvių datą čia"/>
            <?php echo $this->formError->error("sdate_".$spouse['individual_id'].""); ?>
        </div>
        <div id="divorced" class="half" style="display:none">
            <input type="text" name="edate_<?php echo $spouse['individual_id']?>" id="edate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['end_date']; ?>" placeholder="Rašykite skyrybų datą čia"/>
            <?php echo $this->formError->error("edate_".$spouse['individual_id'].""); ?>
        </div>
    </div>
    <?php
    }
    ?>
    <p class="submit">
        <input class="first-btn" type="submit" id="edit-relationship" name="edit-relationship" value="Edit"/>&nbsp;
    </p>
    </form>
jQuery("#divorced_option").click(function() {
   document.getElementById("divorced").style.display = "inline-block";
});
jQuery("#married_option").click(function() {
   document.getElementById("divorced").style.display = "none";
});
$("input[id*=divorced_option]:checked");
如果要检查radio元素的name=属性中是否有子字符串,请将id从选择器更改为name,如下所示:

$("input[name*=divorced_option]:checked");

在此之后,只需检查jQuery是否返回了一个实际的元素。

您可以在检查是否按如下方式选择元素时,根据选项[number]模式选择元素:

form action="familytree.php" method="post">
<?php
foreach ($spouses as $spouse) {
    if (!empty($spouse['mname'])) {
        $name = $spouse['fname'].' '.$spouse['lname'].' ('.$spouse['mname'].')';
    }
    else {
            $name = $spouse['fname'].' '.$spouse['lname'];
    }
    if ($spouse['ended'] == '1') {
        $married = '';
        $divorced = 'checked';
    }
    else {
        $married = 'checked';
        $divorced = '';
    }
    ?>
    <div class="form_section dates">
        <h3><?php echo $name; ?></h3>
        <p>
        <input type="radio" id="married_option" name="married_divorced_options" <?php echo $married; ?> value="1"/>
        <label for="edate">Married</label>&nbsp; &nbsp; &nbsp;  
        <input type="radio" id="divorced_option" name="married_divorced_options" <?php echo $divorced; ?> value="1"/>
        <label for="sdate">Divorced</label> 
        </p>
        <div class="half" style="display: inline">
            <input type="text" name="sdate_<?php echo $spouse['individual_id']?>" id="sdate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['start_date']; ?>" placeholder="Rašykite sutuoktuvių datą čia"/>
            <?php echo $this->formError->error("sdate_".$spouse['individual_id'].""); ?>
        </div>
        <div id="divorced" class="half" style="display:none">
            <input type="text" name="edate_<?php echo $spouse['individual_id']?>" id="edate_<?php echo $spouse['individual_id']?>" value="<?php echo $spouse['end_date']; ?>" placeholder="Rašykite skyrybų datą čia"/>
            <?php echo $this->formError->error("edate_".$spouse['individual_id'].""); ?>
        </div>
    </div>
    <?php
    }
    ?>
    <p class="submit">
        <input class="first-btn" type="submit" id="edit-relationship" name="edit-relationship" value="Edit"/>&nbsp;
    </p>
    </form>
jQuery("#divorced_option").click(function() {
   document.getElementById("divorced").style.display = "inline-block";
});
jQuery("#married_option").click(function() {
   document.getElementById("divorced").style.display = "none";
});
$("input[id*=divorced_option]:checked");
如果要检查radio元素的name=属性中是否有子字符串,请将id从选择器更改为name,如下所示:

$("input[name*=divorced_option]:checked");

在此之后,只需检查jQuery是否返回了一个实际的元素。

在其名称或id中?@AndrewNewby:代码中的第一个单词是jQuery,所以可能是一个安全的赌注。为什么不为所有元素使用class属性呢?因为id是动态显示一些html。甚至是jsfiddle@cookiemonster-哈哈,我怎么会错过这个!!!!!漫长的一天:另一条评论站得住脚——多点HTML会有所帮助。用它的名字还是用它的id?@AndrewNewby:代码中的第一个单词是jQuery,所以可能是一个安全的赌注。为什么不对所有这些使用class属性呢?因为id是动态显示一些html。甚至是jsfiddle@cookiemonster-哈哈,我怎么会错过这个!!!!!漫长的一天:另一条评论仍然有效——多一点HTML会有所帮助。也许可以使用$'dis离'。也显示/隐藏;谢谢,它很有效。但我忘了在我的问题中提到,元素discovered也不是全名,它应该是discovery_161,discovery_162,这取决于单击的单选按钮的名称。如何隐藏与单选按钮匹配的元素?如果单击处理程序引用被单击的元素,则只需在单击处理程序中使用this或$this即可。@j08691,问题是被单击的元素不是应该隐藏的元素。那么被单击的元素如何知道应该隐藏哪个元素呢?关系是什么?可能使用$离异。也显示/隐藏;谢谢,它很有效。但我忘了在我的问题中提到,元素discovered也不是全名,它应该是discovery_161,discovery_162,这取决于单击的单选按钮的名称。如何隐藏与单选按钮匹配的元素?如果单击处理程序引用被单击的元素,则只需在单击处理程序中使用this或$this即可。@j08691,问题是被单击的元素不是应该隐藏的元素。那么被单击的元素如何知道应该隐藏哪个元素呢?什么关系?