網站加載後填寫表格與jQuery

我生成信息一堆<div>這樣的：網站加載後填寫表格與jQuery

@foreach($variables as $variable) 
    <div id="x1_{{$variable->id}}" value="{{$variable->x1}}"></div> 
    <div id="x2_{{$variable->id}}" value="{{$variable->x2}}"></div> 
    <div id="y1_{{$variable->id}}" value="{{$variable->y1}}"></div> 
    <div id="y2_{{$variable->id}}" value="{{$variable->y2}}"></div> 
    <div id="page_{{$variable->id}}" value="{{$variable->page}}"></div> 
    <div id="direction_{{$variable->id}}" value="{{$variable->direction}}"></div> 
    <div id="variable_{{$variable->id}}" value="{{$variable->variable}}"></div> 
@endforeach

那我要填寫時加載的網站上的表單，並且每當下拉變化。下拉式更改可以正常工作，但裝入時填充不起作用。這裏是JavaScript：

這不起作用：

$(document).ready(function() { 
    var drowndown_value = $(this).children(":selected").attr("value"); 
    var x1 = $("#x1_" + drowndown_value).attr("value"); 
    var x2 = $("#x2_" + drowndown_value).attr("value"); 
    var y1 = $("#y1_" + drowndown_value).attr("value"); 
    var y2 = $("#y2_" + drowndown_value).attr("value"); 
    var variable = $("#variable_" + drowndown_value).attr("value"); 
    var regex = $("#regex_" + drowndown_value).attr("value"); 
    var direction = $("#direction_" + drowndown_value).attr("value"); 
    var page = $("#page_" + drowndown_value).attr("value"); 

    $("#x1").val(x1); 
    $("#y1").val(y1); 
    $("#y2").val(y2); 
    $("#x2").val(x2); 
    $("#page").val(page); 
    $("#direction").val(direction); 
    $("#regex").val(regex); 
    $("#variable").val(variable); 
});

這工作：

$("#variabledropdown").change(function() { 
    var drowndown_value = $(this).children(":selected").attr("value"); 
    var x1 = $("#x1_" + drowndown_value).attr("value"); 
    var x2 = $("#x2_" + drowndown_value).attr("value"); 
    var y1 = $("#y1_" + drowndown_value).attr("value"); 
    var y2 = $("#y2_" + drowndown_value).attr("value"); 
    var variable = $("#variable_" + drowndown_value).attr("value"); 
    var regex = $("#regex_" + drowndown_value).attr("value"); 
    var direction = $("#direction_" + drowndown_value).attr("value"); 
    var page = $("#page_" + drowndown_value).attr("value"); 

    $("#x1").val(x1); 
    $("#y1").val(y1); 
    $("#y2").val(y2); 
    $("#x2").val(x2); 
    $("#page").val(page); 
    $("#direction").val(direction); 
    $("#regex").val(regex); 
    $("#variable").val(variable); 
});

我瞎猜，並認爲：

var drowndown_value = $(this).children(":selected").attr("value");

是這裏的問題，但我不知道如何解決它。有什麼建議麼。

來源

2017-04-26 prgrm

嘗試'變種drowndown_value = $（本）。兒童（「：選擇」）。VAL（） ;' – T30

加載時實際上並沒有選擇任何東西，所以你從來沒有找到任何有選擇的孩子。你需要設置默認選擇 – ScanQR

只是FYI你應該使用'val（）'而不是'attr（'value'）' –

的問題是在這裏：

var drowndown_value = $(this).children(":selected").attr("value");

當你這樣做的下拉列表的變化情況，然後$(this)將是下拉列表。

當您在$(document).ready()函數中執行此操作時，$(this)將是文檔本身。

代碼未在第二種情況下工作，因爲該文件沒有，你希望找到孩子。

如果我是你，我會改變都情況下用：

var selectedValue = $("#variabledropdown").val()

你做這件事的方式是不是特別錯誤的，但我寧願上面的選擇，因爲它更簡潔（IIRC ）稍快。

我也主張，你抽象的這兩個功能整合到一個單一的功能（因爲它們是精確拷貝/海誓山盟膏）;但這可能超出了你的問題範圍。

編輯

據this SO question，你不需要去尋找選項孩子們在下拉列表。只要下拉列表是單選（即不能選擇多個選項），則.val()將自動查找所選選項。

var selectedValue = $('#variabledropdown').val();

請注意，這隻適用於檢索值，而不是文本。如果你想選擇的選項的文本，那麼你實際上需要使用查找所選選項：

var selectedText = $('#variabledropdown :selected').text();

來源

2017-04-26 09:07:38 Flater

我解決了這個改變：

var drowndown_value = $(this).children(":selected").attr("value");

到：

var drowndown_value = $("#variabledropdown option:first").val();

感謝您的意見。

來源

2017-04-26 08:46:14 prgrm

網站加載後填寫表格與jQuery

回答

相關問題