Question

我无法理解为什么我的功能不起作用，也许我选择错了？

HTML：

SELECT A.TAX_YEAR,A.MONTH,A.EMPLOYER_CODE
        ,(
            SELECT SUM(AMOUNT)
            FROM V_HR_PP_PROCESS_DATA
            WHERE EMPLOYER_CODE = A.EMPLOYER_CODE
                AND TAX_YEAR = A.TAX_YEAR
                AND PROCESS_MONTH = A.MONTH
                AND EMPLOYEE_ID IN (
                    SELECT EMPLOYEE_ID
                    FROM I_HR_EMP_EMPLOYMENT_DTL
                    WHERE EMPLOYER_CODE = A.EMPLOYER_CODE
                        AND CONTRACT_TERM = 'P'
                    )
                AND PROCESS_MONTH BETWEEN 1
                    AND 10
                AND PD_CODE = 'Z500'
            ) AS GROSS_PERMANENT
        ,b.EMPLOYEE_NAME AS employeename
        ,(
            SELECT SUM(AMOUNT)
            FROM V_HR_PP_PROCESS_DATA
            WHERE EMPLOYER_CODE = A.EMPLOYER_CODE
                AND TAX_YEAR = A.TAX_YEAR
                AND PROCESS_MONTH = A.MONTH
                AND EMPLOYEE_ID IN (
                    SELECT EMPLOYEE_ID
                    FROM I_HR_EMP_EMPLOYMENT_DTL
                    WHERE EMPLOYER_CODE = A.EMPLOYER_CODE
                        AND CONTRACT_TERM = 'F'
                    )
                AND PROCESS_MONTH BETWEEN 1
                    AND 10
                AND PD_CODE = 'Z500'
            ) AS GROSS_CASUAL
    FROM I_HR_SYS_DATE_MONTHLY A
    INNER JOIN I_HR_EMPLOYEE_MASTER b ON b.EMPLOYER_CODE = A.EMPLOYER_CODE
group by A.MONTH,A.TAX_YEAR,A.EMPLOYER_CODE,b.EMPLOYEE_NAME

我想在用户点击第三个单选按钮时显示第二个div。我试图改变剧本的位置，但我不认为这是问题所在。我确信这是一个微不足道的问题。它没有用！

<html>
{% include head.html %}
    <body id="general">

            <header>

                {% include navbar.html %}

                <script>
                $('input[name=optradio])'.click(function () {
                    if (this.id == "showdiv") {
                        $("#onsaanbod").show('slow');
                    } else {
                        $("#onsaanbod").hide('slow');
                    }
                }); 
                </script>

            </header>

            <div class="container-fluid">

                <!-- contenttop -->
                <div class="row"  style="padding-top: 3%; padding-bottom: 3%;" >
                    {% include /getaquote/contenttop-getaquote.html %}
                </div>

                <div class="col-md-12 col-lg-10 col-lg-offset-2">
    <div class="row">
        <div class="col-md-12">
            <p> content </p>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <hr>
        </div>
    </div>

    <!-- start-form -->
    <!-- Volume -->
    <div class="row">
        <div class="col-md-6">
            <p> content </p>

        </div>

        <div class="col-md-6">
            <div class="controls">
                <form id='form-id'>
                <div class="radio">
                    <label><input type="radio" name="optradio">Meer dan 1000 per jaar</label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="optradio">Tussen 500 en 1000 per jaar</label>
                </div>
                <div class="radio">
                    <label><input type="radio" name="optradio" id="showdiv">Minder dan 500 per jaar</label>
                </div>
                </form>
            </div>

        </div>

    </div>

    <div class="row" id="onsaanbod" style='display:none'>
        <div class="col-md-12">
            <h1 class="titlel1"> content </h1>
            <p> content </p>
        </div>
    </div>


</div>

Answer 1

有一个错字：

$('input[name=optradio])'.click
$('input[name=optradio]').click

和

您应该将js移动到正文的底部，或者将其包装在$（document）.ready（）方法中

$(document).ready(function(){ $('input[name=optradio]').click(function () { if (this.id == "showdiv") { $("#onsaanbod").show('slow'); } else { $("#onsaanbod").hide('slow'); } }); });

当你将che click监听器应用于它时，确保元素存在

Answer 2

您必须将代码包装在

中

$(document).ready(function(){
 //Code
});

这将确保脚本在页面加载后触发，从而具有可供使用的资源。在您的情况下，您的代码将如下所示：

$(document).ready(function(){
  $('input[name=optradio]').click(function () {
    if (this.id == "showdiv") {
      $("#onsaanbod").show('slow');
    } else {
      $("#onsaanbod").hide('slow');
    }
  }); 
});

Answer 3

您必须将代码包装成：

// A $( document ).ready() block.
$( document ).ready(function() {
    console.log( "ready!" );
});

There is some reference.

Answer 4

将整个代码包装在内：

$(document).ready(function(){
  // Here..
});

只有在加载所有DOM元素后才会执行。

jQuery事件没有触发

4 个答案: