Question

我正在尝试获取特定患者的处方细节，相应的结果显示在模态窗口中。问题是第一次结果仅在第二次点击时获得。在获得先前数据的连续点击结果。以下是我的HTML：

<table class="table">
    <thead>
        <tr class="text-center" style="font-weight: bold">
            <td></td>
            <td>Name</td>
            <td>ID</td>
            <td>Age</td>
            <td>Registered On</td>
            <td>View Prescription</td>
        </tr>
    </thead>
    <tr class="text-center">
        <td><input name="name" type="text"></td>
        <td><input name="id" type="text"></td>
        <td><input name="age" type="text"></td>
        <td><input name="reg_on" type="text"></td>
        <td>
            <button id="view_prescription_from_patient_list" value="register" onclick="view_prescription_from_patient_list(this.value)">
                <span class="glyphicon glyphicon-share"></span>
            </button>
        </td>
    </tr>
    <div class="modal_show"></div>

function view_prescription_from_patient_list(patient_id) {
    var dataString = "get_what=prescription_list_for_patient_list&patient_id=" + patient_id;
    $.ajax({
        type: "GET",
        url: "ajax_get_data.php",
        data: dataString,
        dataType: "html",
        success: function(response) {
            $('.modal_show').append(response);
        }
    })
}

我在javascript中尝试了on.click方法，但也遇到了同样的问题。

Answer 1

您传递的值为“register”（this.value来自点击的按钮。

而是使用jQuery连接并处理click事件（删除内联onclick处理程序）。

e.g。

$('#view_prescription_from_patient_list').click(function(){ 
        var patient_id = $(this).closest('tr').find('[name=id]').val();
        var dataString = "get_what=prescription_list_for_patient_list&patient_id=" +  patient_id;
        $.ajax({
           type: "GET",
            url: "ajax_get_data.php",
            data: dataString,
            dataType: "html",
            success: function(response) {
                $('.modal_show').append(response);
            }
        })
    }
});

这将从name="id" TD（可能具有ID值 - 但未在您的示例HTML中显示）中获取专利ID。

如果您的代码不遵循它引用的DOM元素，您还需要将它包装在DOM就绪处理程序中：

$(function(){
    // Your code here
});

注意：$(function(){只是$(document).ready(function(){

的快捷方式

Answer 2

使用jquery on.('click'进行编码，您可以从父td获取patient_id 与$(this).parent().parent().find('input[name=id]').val();

一样

此代码可以帮助您理解

＆＃13;

$('#view_prescription_from_patient_list').on('click',function(){

    var patientId = $(this).parent().parent().find('input[name=id]').val();
    var dataString = "get_what=prescription_list_for_patient_list&patient_id="+patientId;

    $.ajax(
            {
                type:"GET",
                url:"ajax_get_data.php",
                data:dataString,
                dataType:"html",
                success:function(response)
                {
                    $('.modal_show').append(response);
                }
            }
    )
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
        <thead>
        <tr class="text-center" style="font-weight: bold">
            <td></td>
            <td>Name</td>
            <td>ID</td>
            <td>Age</td>
            <td>Registered On</td>
            <td>View Prescription</td>
        </tr>
        </thead>
        <tr  class="text-center">
            <td><input name="name" type="text"></td>
            <td><input name="id" type="text"></td>
            <td><input name="age" type="text"></td>
            <td><input name="reg_on" type="text"></td>
            <td><button id="view_prescription_from_patient_list" value="register" ><span class="glyphicon glyphicon-share"></span></button></td>
        </tr>

＆＃13;

Answer 3

您正在阅读以前答案中指出的错误价值。
我建议也使用Unobtrusive JavaScript

    import android.support.v4.widget.DrawerLayout;
private DrawerLayout drawerLayout;


drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
        drawerListener = new ActionBarDrawerToggle(this, drawerLayout,
                R.drawable.ic_drawer2, R.string.drawer_open,
                R.string.drawer_close) {
            @Override
            public void onDrawerClosed(View drawerView) {

                Toast.makeText(NavigationDrawerActivity.this, "on drawer close",
                        Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onDrawerOpened(View drawerView) {

                Toast.makeText(NavigationDrawerActivity.this, "on drawer open",
                        Toast.LENGTH_SHORT).show();
            }
        };
        drawerLayout.setDrawerListener(drawerListener);


@Override
    protected void onPostCreate(Bundle savedInstanceState) {
        super.onPostCreate(savedInstanceState);
        drawerListener.syncState();
    }

@Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.

        int id  = item.getItemId();
        if(drawerListener.onOptionsItemSelected(item)){
            return true;
        }


        return super.onOptionsItemSelected(item);

    }
@Override
    public void onConfigurationChanged(Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        drawerListener.onConfigurationChanged(newConfig);
    }

如果您因某种原因确实需要坚持$( document ).ready(function(){ $('#view_prescription_from_patient_list').on('click', function(){ var patient_id = $('[name="id"]', $(this).closest('tr')).val(), dataString = "get_what=prescription_list_for_patient_list&patient_id="+patient_id; $.ajax({ // ... }); }); });属性（虽然您不应该这样做），请将按钮传递给方法：

onclick

然后在JS：

<button id="view_prescription_from_patient_list" value="register" onclick="view_prescription_from_patient_list(this)">
     <span class="glyphicon glyphicon-share"></span>
</button>

Answer 4

由于您已经在使用jQuery，因此可以连接＆＃34; onclick＆＃34;使用jQuery的按钮事件。

您需要像这样连接事件处理程序。

$(document).ready(function() {
    $('#view_prescription_from_patient_list').on('click', function(e) {
        e.preventDefault();

        var patientId = $(this).parent().parent().find('input[name=id]').val();

        // do your ajax call here...
    });
});

Javascript函数仅在第二次单击时起作用

4 个答案: